@import "https://fonts.googleapis.com/css2?family=Ubuntu+Mono:wght@400;700&display=swap";

html {
  word-break: break-word;
  overflow-wrap: anywhere
}

body {
  margin: 0
}

.brand-bar {
  background: linear-gradient(135deg, #4B3F9B 0%, #3a3080 100%);
  padding: 12px 0;
  position: relative;
  overflow: hidden
}

.brand-bar::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, #AA92C9, #F7F4FA, #AA92C9, transparent)
}

.brand-bar-box {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px
}

.brand-tagline {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 14px;
  color: #AA92C9;
  letter-spacing: .08em;
  line-height: 1.15
}

.brand-contact-link {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 14px;
  color: #F7F4FA;
  text-decoration: none;
  letter-spacing: .04em;
  line-height: 1.15;
  padding: 6px 12px;
  border: 1px solid #aa92c966;
  border-radius: 2px;
  transition: background .15s ease-out, border-color .15s ease-out
}

.brand-contact-link:hover {
  background: #aa92c92e;
  border-color: #aa92c9b3
}

.brand-contact-link:focus {
  outline: none;
  box-shadow: 0 0 0 3px #4b3f9b73
}

.header-main {
  background: #F7F4FA;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c;
  position: relative
}

.header-main-box {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 48px;
  min-height: 80px
}

.logo-box {
  display: flex;
  align-items: center;
  flex-shrink: 0
}

.logo-ring {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 0 0 2px #4b3f9b33 1px 2px 2px 0 #4b3f9b0f;
  padding: 6px;
  text-decoration: none
}

.logo-ring img {
  width: 36px;
  height: 36px;
  object-fit: contain;
  display: block
}

.logo-name {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 18px;
  font-weight: 700;
  color: #4B3F9B;
  letter-spacing: .06em;
  line-height: 1.15;
  margin-left: 12px;
  text-decoration: none
}

.primary-menu {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0
}

.primary-menu__item {
  display: flex
}

.primary-menu__link {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 16px;
  font-weight: 400;
  color: #4B3F9B;
  text-decoration: none;
  letter-spacing: .03em;
  line-height: 1.4;
  padding: 12px;
  border-radius: 2px;
  border-bottom: 2px solid transparent;
  transition: color .12s ease-out, background .12s ease-out, border-color .18s ease-out;
  display: block;
  white-space: nowrap
}

.primary-menu__link:hover {
  color: #3a3080;
  background: linear-gradient(180deg, transparent, #4b3f9b12);
  border-bottom-color: #AA92C9
}

.primary-menu__link:focus {
  outline: none;
  box-shadow: 0 0 0 3px #4b3f9b59
}

.primary-menu__link--active {
  color: #4B3F9B;
  font-weight: 700;
  border-bottom-color: #4B3F9B;
  background: #4b3f9b0f
}

.header-region {
  display: flex;
  align-items: center;
  flex-shrink: 0
}

.region-selector {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: 'Ubuntu Mono', monospace;
  font-size: 14px;
  color: #4B3F9B;
  letter-spacing: .05em;
  padding: 6px 12px;
  border: 1px solid #4b3f9b40;
  border-radius: 2px;
  background: #fff;
  cursor: pointer;
  transition: border-color .15s ease-out, background .15s ease-out;
  min-height: 44px
}

.region-selector:hover {
  border-color: #4b3f9b80;
  background: linear-gradient(180deg, #fff, #F7F4FA)
}

.region-selector:focus {
  outline: none;
  box-shadow: 0 0 0 3px #4b3f9b59
}

.region-flag {
  width: 18px;
  height: 12px;
  display: inline-flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 2px;
  flex-shrink: 0
}

.region-flag__stripe--top {
  flex: 1;
  background: #fff
}

.region-flag__stripe--bottom {
  flex: 1;
  background: #dc143c
}

.footer-main {
  background: #4B3F9B;
  box-shadow: 1px 9px 48px 0 #4b3f9b1f 1px 7px 14px 0 #4b3f9b1c 1px 2px 2px 0 #4b3f9b0f;
  margin-top: auto
}

.footer-upper {
  max-width: 1140px;
  margin: 0 auto;
  padding: 48px 24px 24px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px
}

.footer-brand-block {
  display: flex;
  flex-direction: column;
  gap: 24px
}

.footer-logo-row {
  display: flex;
  align-items: center;
  gap: 12px
}

.footer-logo-ring {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 2px;
  background: #f7f4fa1f;
  box-shadow: 0 0 0 2px #f7f4fa4d 1px 2px 2px 0 #4b3f9b0f;
  padding: 6px;
  text-decoration: none;
  flex-shrink: 0
}

.footer-logo-ring img {
  width: 36px;
  height: 36px;
  object-fit: contain;
  display: block;
  background: #fff;
  border-radius: 2px
}

.footer-brand-name {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 18px;
  font-weight: 700;
  color: #F7F4FA;
  letter-spacing: .06em;
  line-height: 1.15;
  text-decoration: none
}

.footer-description {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 14px;
  color: #f7f4fabf;
  line-height: 1.65;
  letter-spacing: .02em;
  max-width: 360px
}

.footer-contact-block {
  display: flex;
  flex-direction: column;
  gap: 12px
}

.footer-contact-label {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 14px;
  font-weight: 700;
  color: #AA92C9;
  letter-spacing: .1em;
  line-height: 1.15;
  text-transform: uppercase
}

.footer-contact-item {
  display: flex;
  align-items: center;
  gap: 12px
}

.footer-contact-icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center
}

.footer-contact-icon svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: #AA92C9;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round
}

.footer-email-link {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 16px;
  color: #F7F4FA;
  text-decoration: none;
  letter-spacing: .03em;
  line-height: 1.4;
  transition: color .12s ease-out
}

.footer-email-link:hover {
  color: #AA92C9
}

.footer-email-link:focus {
  outline: none;
  box-shadow: 0 0 0 3px #aa92c980;
  border-radius: 2px
}

.footer-domain-text {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 14px;
  color: #f7f4fa99;
  letter-spacing: .03em;
  line-height: 1.4
}

.footer-divider {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #aa92c966, transparent)
}

.footer-lower {
  max-width: 1140px;
  margin: 0 auto;
  padding: 24px 24px 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px
}

.footer-legal-menu {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0
}

.footer-legal-menu__item {
  display: flex;
  align-items: center
}

.footer-legal-menu__separator {
  width: 3px;
  height: 3px;
  border-radius: 24px;
  background: #aa92c980;
  margin: 0 6px;
  flex-shrink: 0
}

.footer-legal-menu__link {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 14px;
  color: #f7f4faa6;
  text-decoration: none;
  letter-spacing: .03em;
  line-height: 1.4;
  padding: 6px;
  border-radius: 2px;
  transition: color .12s ease-out
}

.footer-legal-menu__link:hover {
  color: #F7F4FA
}

.footer-legal-menu__link:focus {
  outline: none;
  box-shadow: 0 0 0 3px #aa92c980
}

.footer-copyright {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 14px;
  color: #f7f4fa80;
  letter-spacing: .04em;
  line-height: 1.4
}

.toast-container {
  position: fixed;
  top: 24px;
  right: 24px;
  z-index: 1000;
  max-width: 340px;
  width: calc(100vw - 48px)
}

.consent-toast {
  background: #fff;
  border-radius: 2px;
  box-shadow: 1px 9px 48px 0 #4b3f9b1f 1px 7px 14px 0 #4b3f9b1c;
  border-top: 3px solid #4B3F9B;
  padding: 24px;
  opacity: 0;
  transition: opacity .26s ease-out
}

.consent-toast--visible {
  opacity: 1
}

.consent-icon-row {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px
}

.consent-icon-row svg {
  width: 28px;
  height: 28px;
  stroke: #4B3F9B;
  fill: none;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round
}

.consent-text {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 14px;
  color: #2a2060;
  line-height: 1.65;
  letter-spacing: .02em;
  margin-bottom: 12px
}

.consent-panel {
  overflow: hidden;
  max-height: 0;
  transition: max-height .2s ease-out
}

.consent-panel--open {
  max-height: 200px
}

.consent-toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 0;
  border-top: 1px solid #4b3f9b1f
}

.consent-toggle-label {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 14px;
  color: #4B3F9B;
  letter-spacing: .02em
}

.consent-toggle-always {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 14px;
  color: #AA92C9;
  letter-spacing: .02em
}

.consent-toggle-switch {
  position: relative;
  width: 36px;
  height: 20px;
  flex-shrink: 0
}

.consent-toggle-switch input {
  opacity: 0;
  width: 0;
  height: 0;
  position: absolute
}

.consent-toggle-track {
  position: absolute;
  inset: 0;
  background: #AA92C9;
  border-radius: 24px;
  cursor: pointer;
  transition: background .15s ease-out
}

.consent-toggle-track::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 14px;
  border-radius: 24px;
  background: #fff;
  top: 3px;
  left: 3px;
  transition: transform .15s ease-out
}

.consent-toggle-switch input:checked+.consent-toggle-track {
  background: #4B3F9B
}

.consent-toggle-switch input:checked+.consent-toggle-track::after {
  transform: translateX(16px)
}

.consent-toggle-switch input:focus+.consent-toggle-track {
  box-shadow: 0 0 0 3px #4b3f9b59
}

.consent-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #4b3f9b1f;
  flex-wrap: wrap
}

.consent-btn-expand {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 14px;
  color: #AA92C9;
  background: none;
  border: none;
  cursor: pointer;
  padding: 6px;
  text-decoration: underline;
  text-underline-offset: 3px;
  letter-spacing: .03em;
  line-height: 1.4;
  border-radius: 2px;
  transition: color .12s ease-out;
  min-height: 44px
}

.consent-btn-expand:hover {
  color: #4B3F9B
}

.consent-btn-expand:focus {
  outline: none;
  box-shadow: 0 0 0 3px #4b3f9b59
}

.consent-btn-group {
  display: flex;
  align-items: center;
  gap: 12px
}

.consent-btn-reject {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 14px;
  color: #4B3F9B;
  background: none;
  border: none;
  cursor: pointer;
  padding: 6px;
  text-decoration: underline;
  text-underline-offset: 3px;
  letter-spacing: .03em;
  line-height: 1.4;
  border-radius: 2px;
  transition: color .12s ease-out;
  min-height: 44px
}

.consent-btn-reject:hover {
  color: #3a3080
}

.consent-btn-reject:focus {
  outline: none;
  box-shadow: 0 0 0 3px #4b3f9b59
}

.consent-btn-accept {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 14px;
  font-weight: 700;
  color: #F7F4FA;
  background: #4B3F9B;
  border: none;
  cursor: pointer;
  padding: 6px 12px;
  border-radius: 2px;
  letter-spacing: .03em;
  line-height: 1.4;
  transition: background .15s ease-out, box-shadow .15s ease-out;
  min-height: 44px
}

.consent-btn-accept:hover {
  background: linear-gradient(135deg, #4B3F9B, #3a3080);
  box-shadow: 1px 7px 14px 0 #4b3f9b40
}

.consent-btn-accept:focus {
  outline: none;
  box-shadow: 0 0 0 3px #4b3f9b73
}

.preference-tab {
  position: fixed;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 999;
  background: #4B3F9B;
  border-radius: 0 2px 2px 0;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c;
  cursor: pointer;
  padding: 12px 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  min-width: 28px;
  border: none;
  transition: background .15s ease-out, box-shadow .15s ease-out
}

.preference-tab:hover {
  background: linear-gradient(135deg, #4B3F9B, #3a3080);
  box-shadow: 1px 9px 48px 0 #4b3f9b2e
}

.preference-tab:focus {
  outline: none;
  box-shadow: 0 0 0 3px #4b3f9b73
}

.preference-tab svg {
  width: 14px;
  height: 14px;
  stroke: #F7F4FA;
  fill: none;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round
}

@media (max-width: 700px) {
  .brand-bar-box {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    padding: 12px 24px
  }

  .header-main-box {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 12px 24px;
    min-height: auto
  }

  .logo-box {
    justify-content: flex-start
  }

  .primary-menu {
    justify-content: flex-start
  }

  .header-region {
    justify-content: flex-start
  }

  .footer-upper {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 48px 24px 24px
  }

  .footer-lower {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px
  }

  .toast-container {
    top: 12px;
    right: 12px;
    left: 12px;
    max-width: none;
    width: auto
  }
}

.legal-body {
  max-width: 1140px;
  margin: 0 auto;
  padding: 48px 24px;
  color: #2a2240;
  line-height: 1.65
}

.legal-body h1 {
  font-size: 36px;
  line-height: 1.15;
  color: #4B3F9B;
  margin-bottom: 24px;
  margin-top: 0;
  letter-spacing: -.01em
}

.legal-body h2 {
  font-size: 24px;
  line-height: 1.4;
  color: #4B3F9B;
  margin-top: 48px;
  margin-bottom: 12px;
  letter-spacing: 0
}

.legal-body h3 {
  font-size: 18px;
  line-height: 1.4;
  color: #3a3070;
  margin-top: 24px;
  margin-bottom: 12px
}

.legal-body h4 {
  font-size: 16px;
  line-height: 1.4;
  color: #3a3070;
  margin-top: 24px;
  margin-bottom: 6px
}

.legal-body h5 {
  font-size: 14px;
  line-height: 1.4;
  color: #4B3F9B;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-top: 24px;
  margin-bottom: 6px
}

.legal-body h6 {
  font-size: 14px;
  line-height: 1.4;
  color: #6b5fb0;
  letter-spacing: .04em;
  margin-top: 12px;
  margin-bottom: 6px
}

.legal-body p {
  font-size: 16px;
  line-height: 1.65;
  color: #2a2240;
  margin-top: 0;
  margin-bottom: 12px
}

.legal-body ul {
  font-size: 16px;
  line-height: 1.65;
  color: #2a2240;
  margin-top: 0;
  margin-bottom: 12px;
  padding-left: 24px;
  list-style: none
}

.legal-body ol {
  font-size: 16px;
  line-height: 1.65;
  color: #2a2240;
  margin-top: 0;
  margin-bottom: 12px;
  padding-left: 24px;
  list-style: decimal
}

.legal-body ul li {
  margin-bottom: 6px;
  padding-left: 12px;
  position: relative
}

.legal-body ul li::before {
  content: "";
  position: absolute;
  left: -6px;
  top: 10px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #AA92C9
}

.legal-body ol li {
  margin-bottom: 6px;
  padding-left: 6px
}

.legal-body ol li::marker {
  color: #AA92C9;
  font-weight: 600
}

.legal-body em,
.legal-body i {
  color: #4B3F9B;
  font-style: italic
}

.legal-body table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  line-height: 1.65;
  margin-top: 24px;
  margin-bottom: 24px;
  border-radius: 2px;
  overflow: hidden;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.legal-body thead {
  background-color: #4B3F9B;
  color: #fff
}

.legal-body thead th {
  padding: 12px 24px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .05em;
  text-align: left;
  color: #fff;
  border: none
}

.legal-body tbody tr {
  background-color: #fff;
  transition: background-color .15s ease-out
}

.legal-body tbody tr:nth-child(even) {
  background-color: #F7F4FA
}

.legal-body tbody tr:hover {
  background-color: #ede8f7
}

.legal-body td {
  padding: 12px 24px;
  font-size: 14px;
  color: #2a2240;
  border-bottom: 1px solid #e8e2f5;
  vertical-align: top
}

.legal-body th {
  padding: 12px 24px;
  font-size: 14px;
  color: #2a2240;
  border-bottom: 1px solid #e8e2f5;
  vertical-align: top;
  text-align: left
}

.legal-body thead th {
  border-bottom: none;
  color: #fff
}

.legal-body hr {
  border: none;
  border-top: 1px solid #d6cef0;
  margin-top: 48px;
  margin-bottom: 48px;
  height: 0
}

.legal-body div {
  font-size: 16px;
  line-height: 1.65
}

@media (max-width: 768px) {
  .legal-body {
    padding: 24px 12px
  }

  .legal-body h1 {
    font-size: 24px
  }

  .legal-body h2 {
    font-size: 18px;
    margin-top: 24px
  }

  .legal-body h3 {
    font-size: 16px
  }

  .legal-body table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch
  }

  .legal-body thead th,
  .legal-body td,
  .legal-body th {
    padding: 12px
  }
}

.services-detail {
  background: #fff;
  overflow-x: clip
}

.services-detail .reading-strip {
  background: #F7F4FA;
  border-bottom: 1px solid #4b3f9b1a;
  padding: 6px 24px
}

.services-detail .reading-strip__row {
  max-width: 1140px;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap
}

.services-detail .reading-strip__badge {
  font-size: 14px;
  line-height: 1.4;
  color: #4B3F9B;
  letter-spacing: .06em;
  font-weight: 600;
  text-transform: uppercase
}

.services-detail .reading-strip__meta {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
  margin-left: auto
}

.services-detail .reading-strip__item {
  font-size: 14px;
  line-height: 1.4;
  color: #5a4e8a;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 6px
}

.services-detail .reading-strip__item svg {
  flex-shrink: 0
}

.services-detail .article-title-block {
  max-width: 1140px;
  margin: 0 auto;
  padding: 48px 24px;
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 48px;
  align-items: stretch
}

.services-detail .article-image-strip {
  position: relative;
  border-radius: 2px;
  overflow: hidden;
  min-height: 340px
}

.services-detail .article-image-strip img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: grayscale(30%) saturate(1.3);
  transition: filter .18s ease-out
}

.services-detail .article-image-strip::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, #4b3f9b73 0%, #aa92c940 100%);
  pointer-events: none;
  transition: opacity .18s ease-out
}

.services-detail .article-image-strip:hover img {
  filter: grayscale(0%) saturate(1.5)
}

.services-detail .article-image-strip:hover::after {
  opacity: 0
}

.services-detail .article-image-strip__corner {
  position: absolute;
  top: 12px;
  left: 12px;
  pointer-events: none;
  z-index: 1
}

.services-detail .article-image-strip__corner svg {
  display: block
}

.services-detail .article-text-area {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 24px;
  position: relative
}

.services-detail .article-text-area__corner {
  position: absolute;
  bottom: 0;
  right: 0;
  pointer-events: none
}

.services-detail .article-heading {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #1e1640;
  letter-spacing: -.02em;
  margin: 0
}

.services-detail .article-heading span {
  display: block
}

.services-detail .article-kicker {
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #4B3F9B;
  font-weight: 700;
  margin: 0
}

.services-detail .article-intro-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap
}

.services-detail .article-price-tag {
  background: linear-gradient(90deg, #4B3F9B 0%, #AA92C9 100%);
  color: #fff;
  font-size: 24px;
  font-weight: 800;
  line-height: 1.15;
  padding: 6px 24px;
  border-radius: 2px;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c;
  letter-spacing: -.01em
}

.services-detail .article-pricedes {
  font-size: 14px;
  line-height: 1.65;
  color: #5a4e8a;
  margin: 0
}

.services-detail .article-enroll-btn {
  display: inline-block;
  background: #4B3F9B;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  padding: 12px 24px;
  border-radius: 2px;
  text-decoration: none;
  border: none;
  cursor: pointer;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  transition: box-shadow .15s ease-out, background .15s ease-out;
  letter-spacing: .02em
}

.services-detail .article-enroll-btn:hover {
  background: linear-gradient(90deg, #4B3F9B 0%, #7b68c8 100%);
  box-shadow: 1px 9px 48px 0 #4b3f9b1f
}

.services-detail .article-enroll-btn:focus {
  outline: 3px solid #AA92C9;
  outline-offset: 2px
}

.services-detail .article-seats {
  font-size: 14px;
  line-height: 1.4;
  color: #4B3F9B;
  font-weight: 600;
  letter-spacing: .04em;
  padding: 6px 12px;
  border: 1.5px solid #AA92C9;
  border-radius: 2px;
  background: #F7F4FA
}

.services-detail .divider-gradient {
  max-width: 1140px;
  margin: 0 auto 0 24px;
  height: 2px;
  background: linear-gradient(90deg, #4B3F9B 0%, #aa92c900 100%);
  border: none
}

.services-detail .article-body-layout {
  max-width: 1140px;
  margin: 0 auto;
  padding: 48px 24px 96px;
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 48px;
  align-items: start
}

.services-detail .article-description {
  min-width: 0
}

.services-detail .article-description h2 {
  font-size: 24px;
  line-height: 1.15;
  font-weight: 900;
  color: #1e1640;
  letter-spacing: -.01em;
  margin: 0 0 12px
}

.services-detail .article-description h3 {
  font-size: 18px;
  line-height: 1.4;
  font-weight: 700;
  color: #4B3F9B;
  margin: 24px 0 6px
}

.services-detail .article-description p {
  font-size: 16px;
  line-height: 1.65;
  color: #2d2560;
  margin: 0 0 12px
}

.services-detail .article-description small {
  font-size: 14px;
  line-height: 1.65;
  color: #6a5fa0;
  display: block;
  margin-bottom: 12px
}

.services-detail .article-description ul {
  margin: 0 0 12px;
  padding-left: 24px;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 6px
}

.services-detail .article-description ul li {
  font-size: 16px;
  line-height: 1.65;
  color: #2d2560;
  position: relative;
  padding-left: 18px
}

.services-detail .article-description ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #AA92C9;
  border: 2px solid #4B3F9B
}

.services-detail .program-block {
  background: #F7F4FA;
  border-radius: 24px;
  padding: 24px;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  border-top: 4px solid #4B3F9B;
  margin-top: 48px
}

.services-detail .program-block__label {
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #4B3F9B;
  font-weight: 700;
  margin: 0 0 12px
}

.services-detail .program-block h2 {
  font-size: 24px;
  line-height: 1.15;
  font-weight: 900;
  color: #1e1640;
  letter-spacing: -.01em;
  margin: 0 0 12px
}

.services-detail .program-block h3 {
  font-size: 18px;
  line-height: 1.4;
  font-weight: 700;
  color: #4B3F9B;
  margin: 24px 0 6px
}

.services-detail .program-block p {
  font-size: 16px;
  line-height: 1.65;
  color: #2d2560;
  margin: 0 0 12px
}

.services-detail .program-block blockquote {
  border-left: none;
  margin: 12px 0;
  padding: 12px 24px;
  background: #fff;
  border-radius: 2px;
  box-shadow: inset 2px 4px 6px 0 #4b3f9b0f;
  font-size: 16px;
  line-height: 1.65;
  color: #4B3F9B;
  font-style: italic
}

.services-detail .program-block blockquote::before {
  content: "\201C";
  font-size: 36px;
  line-height: 1;
  color: #AA92C9;
  display: block;
  margin-bottom: 6px;
  font-style: normal
}

.services-detail .program-block blockquote::after {
  content: "\201D";
  font-size: 36px;
  line-height: 1;
  color: #AA92C9;
  display: block;
  text-align: right;
  margin-top: 6px;
  font-style: normal
}

.services-detail .program-block ol {
  margin: 0 0 12px;
  padding-left: 24px;
  display: flex;
  flex-direction: column;
  gap: 6px
}

.services-detail .program-block ol li {
  font-size: 16px;
  line-height: 1.65;
  color: #2d2560
}

.services-detail .program-block ul {
  margin: 0 0 12px;
  padding-left: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 6px
}

.services-detail .program-block ul li {
  font-size: 16px;
  line-height: 1.65;
  color: #2d2560;
  position: relative;
  padding-left: 18px
}

.services-detail .program-block ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #4B3F9B
}

.services-detail .program-block abbr {
  text-decoration: underline dotted #AA92C9;
  cursor: help;
  color: #4B3F9B
}

.services-detail .program-block cite {
  font-style: italic;
  color: #6a5fa0;
  font-size: 14px
}

.services-detail .program-block figure {
  margin: 12px 0
}

.services-detail .program-block figcaption {
  font-size: 14px;
  line-height: 1.4;
  color: #6a5fa0;
  margin-top: 6px
}

.services-detail .sidebar {
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: sticky;
  top: 24px
}

.services-detail .sidebar-card {
  background: #fff;
  border-radius: 24px;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c;
  padding: 24px;
  border-top: 4px solid #AA92C9
}

.services-detail .sidebar-card__heading {
  font-size: 18px;
  line-height: 1.4;
  font-weight: 800;
  color: #1e1640;
  margin: 0 0 12px;
  letter-spacing: -.01em
}

.services-detail .sidebar-card__row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 6px 0;
  border-bottom: 1px solid #4b3f9b14
}

.services-detail .sidebar-card__row:last-child {
  border-bottom: none
}

.services-detail .sidebar-card__label {
  font-size: 14px;
  line-height: 1.4;
  color: #6a5fa0;
  font-weight: 500;
  letter-spacing: .03em
}

.services-detail .sidebar-card__value {
  font-size: 14px;
  line-height: 1.4;
  color: #1e1640;
  font-weight: 700;
  text-align: right
}

.services-detail .poll-card {
  background: linear-gradient(90deg, #F7F4FA 0%, #fff 100%);
  border-radius: 24px;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c;
  padding: 24px;
  border-top: 4px solid #4B3F9B;
  animation: subtleBackground 15s linear infinite
}

@keyframes subtleBackground {
  0% {
    background-color: #F7F4FA
  }

  50% {
    background-color: #ede8f5
  }

  100% {
    background-color: #F7F4FA
  }
}

.services-detail .poll-card__heading {
  font-size: 16px;
  line-height: 1.4;
  font-weight: 800;
  color: #1e1640;
  margin: 0 0 12px
}

.services-detail .poll-card__question {
  font-size: 14px;
  line-height: 1.65;
  color: #2d2560;
  margin: 0 0 12px
}

.services-detail .poll-option {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border-radius: 2px;
  border: 1.5px solid #4b3f9b26;
  margin-bottom: 6px;
  cursor: pointer;
  transition: border-color .15s ease-out, background .18s ease;
  background: #fff
}

.services-detail .poll-option:hover {
  border-color: #AA92C9;
  background: #F7F4FA
}

.services-detail .poll-radio {
  appearance: none;
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid #AA92C9;
  background: #fff;
  flex-shrink: 0;
  cursor: pointer;
  transition: border-color .15s ease-out, background .15s ease-out;
  position: relative
}

.services-detail .poll-radio:checked {
  border-color: #4B3F9B;
  background: #4B3F9B;
  box-shadow: inset 0 0 0 3px #fff
}

.services-detail .poll-option:has(.poll-radio:checked) {
  border-color: #4B3F9B;
  background: linear-gradient(90deg, #F7F4FA 0%, #ede8f5 100%);
  box-shadow: 1px 2px 2px 0 #4b3f9b0f
}

.services-detail .poll-option-label {
  font-size: 14px;
  line-height: 1.4;
  color: #2d2560;
  font-weight: 500;
  cursor: pointer
}

.services-detail .poll-option:has(.poll-radio:checked) .poll-option-label {
  color: #4B3F9B;
  font-weight: 700
}

.services-detail .report-link-row {
  padding-top: 6px;
  border-top: 1px solid #4b3f9b1a;
  margin-top: 6px
}

.services-detail .report-link {
  font-size: 14px;
  line-height: 1.4;
  color: #AA92C9;
  text-decoration: none;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 6px;
  transition: color .12s ease-out;
  letter-spacing: .02em
}

.services-detail .report-link:hover {
  color: #4B3F9B
}

.services-detail .report-link:focus {
  outline: 2px solid #4B3F9B;
  outline-offset: 2px;
  border-radius: 2px
}

.services-detail .concentric-deco {
  pointer-events: none;
  display: block
}

@media (max-width: 900px) {
  .services-detail .article-title-block {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 24px
  }

  .services-detail .article-image-strip {
    min-height: 220px;
    max-height: 260px
  }

  .services-detail .article-body-layout {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 24px 24px 48px
  }

  .services-detail .sidebar {
    position: static
  }
}

@media (max-width: 600px) {
  .services-detail .article-heading {
    font-size: 24px
  }

  .services-detail .article-price-tag {
    font-size: 18px
  }

  .services-detail .reading-strip__meta {
    margin-left: 0;
    gap: 12px
  }
}

.masterclass-detail {
  background: #fff;
  overflow-x: clip;
  position: relative
}

.masterclass-detail .reading-bar {
  position: sticky;
  top: 0;
  z-index: 100;
  background: #fff;
  border-bottom: 1px solid #AA92C9;
  padding: 12px 24px;
  display: flex;
  align-items: center;
  gap: 24px;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f
}

.masterclass-detail .reading-bar__meta {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-left: auto;
  flex-shrink: 0
}

.masterclass-detail .reading-bar__time {
  font-size: 14px;
  color: #4B3F9B;
  letter-spacing: .06em;
  line-height: 1.15
}

.masterclass-detail .reading-bar__views {
  font-size: 14px;
  color: #7a6aaa;
  letter-spacing: .04em;
  line-height: 1.15
}

.masterclass-detail .reading-bar__label {
  font-size: 14px;
  font-weight: 700;
  color: #4B3F9B;
  letter-spacing: .08em;
  line-height: 1.15
}

.masterclass-detail .article-frame {
  max-width: 1140px;
  margin: 0 auto;
  padding: 48px 24px 0
}

.masterclass-detail .title-grid {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 48px;
  align-items: stretch;
  position: relative
}

.masterclass-detail .title-text {
  padding: 48px 0 48px 48px;
  position: relative
}

.masterclass-detail .title-text::before {
  content: "";
  display: block;
  width: 4px;
  height: 36px;
  background: linear-gradient(180deg, #4B3F9B 0%, #AA92C9 100%);
  border-radius: 2px;
  margin-bottom: 24px
}

.masterclass-detail .title-bracket {
  position: absolute;
  top: 24px;
  left: 0;
  width: 32px;
  height: 80px;
  border-top: 3px solid #4B3F9B;
  border-left: 3px solid #4B3F9B;
  border-radius: 2px 0 0 0
}

.masterclass-detail .title-bracket--bottom {
  top: auto;
  bottom: 24px;
  border-top: none;
  border-bottom: 3px solid #4B3F9B;
  border-left: 3px solid #4B3F9B;
  border-radius: 0 0 0 2px
}

.masterclass-detail .title-tag {
  display: inline-block;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .1em;
  color: #4B3F9B;
  background: #F7F4FA;
  border: 1px solid #AA92C9;
  border-radius: 2px;
  padding: 6px 12px;
  margin-bottom: 24px;
  line-height: 1.15
}

.masterclass-detail .title-heading {
  font-size: 36px;
  font-weight: 900;
  line-height: 1.15;
  letter-spacing: -.02em;
  color: #1e1a3a;
  margin: 0 0 24px
}

.masterclass-detail .title-heading .accent-word {
  color: #4B3F9B;
  position: relative;
  display: inline-block
}

.masterclass-detail .title-heading .accent-word::after {
  content: "";
  position: absolute;
  bottom: 2px;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, #4B3F9B 0%, #AA92C9 100%);
  border-radius: 2px
}

.masterclass-detail .title-lead {
  font-size: 18px;
  line-height: 1.65;
  color: #3a3060;
  margin: 0 0 24px
}

.masterclass-detail .price-badge {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  background: linear-gradient(90deg, #4B3F9B 0%, #7060c0 100%);
  border-radius: 2px;
  padding: 12px 24px;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c;
  margin-top: 12px;
  transition: box-shadow .15s ease-out;
  text-decoration: none
}

.masterclass-detail .price-badge:hover {
  box-shadow: 1px 9px 48px 0 #4b3f9b1f
}

.masterclass-detail .price-badge__amount {
  font-size: 24px;
  font-weight: 900;
  color: #fff;
  line-height: 1.15
}

.masterclass-detail .price-badge__desc {
  font-size: 14px;
  color: #fffc;
  line-height: 1.4
}

.masterclass-detail .title-image-strip {
  position: relative;
  overflow: hidden;
  border-radius: 2px;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.masterclass-detail .title-image-strip::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, #4b3f9b8c 0%, #aa92c94d 100%);
  mix-blend-mode: multiply;
  z-index: 1;
  transition: opacity .2s ease-out
}

.masterclass-detail .title-image-strip:hover::before {
  opacity: 0
}

.masterclass-detail .title-image-strip img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: contrast(1.08) saturate(0.9);
  transition: filter .2s ease-out
}

.masterclass-detail .title-image-strip:hover img {
  filter: contrast(1.0) saturate(1.1)
}

.masterclass-detail .image-bracket-tr {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 28px;
  height: 28px;
  border-top: 2px solid #ffffffb3;
  border-right: 2px solid #ffffffb3;
  border-radius: 0 2px 0 0;
  z-index: 2;
  pointer-events: none
}

.masterclass-detail .image-bracket-bl {
  position: absolute;
  bottom: 12px;
  left: 12px;
  width: 28px;
  height: 28px;
  border-bottom: 2px solid #ffffffb3;
  border-left: 2px solid #ffffffb3;
  border-radius: 0 0 0 2px;
  z-index: 2;
  pointer-events: none
}

.masterclass-detail .section-divider--concave {
  position: relative;
  height: 48px;
  background: #fff;
  overflow: hidden
}

.masterclass-detail .section-divider--concave::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: -5%;
  width: 110%;
  height: 80px;
  background: #F7F4FA;
  border-radius: 50% 50% 0 0 / 100% 100% 0 0
}

.masterclass-detail .body-frame {
  background: #F7F4FA;
  padding: 48px 0 96px
}

.masterclass-detail .body-grid {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 1fr 360px;
  gap: 48px;
  align-items: start
}

.masterclass-detail .body-primary {
  min-width: 0
}

.masterclass-detail .description-block {
  background: #fff;
  border-radius: 2px;
  padding: 48px;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  margin-bottom: 24px
}

.masterclass-detail .description-block__heading {
  font-size: 24px;
  font-weight: 900;
  line-height: 1.15;
  letter-spacing: -.01em;
  color: #1e1a3a;
  margin: 0 0 24px;
  display: flex;
  align-items: center;
  gap: 12px
}

.masterclass-detail .description-block__heading::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  background: #4B3F9B;
  border-radius: 50%;
  flex-shrink: 0
}

.masterclass-detail .description-block p {
  font-size: 16px;
  line-height: 1.65;
  color: #2e2850;
  margin: 0 0 12px
}

.masterclass-detail .description-block p:last-child {
  margin-bottom: 0
}

.masterclass-detail .description-block h2 {
  font-size: 18px;
  font-weight: 800;
  line-height: 1.4;
  color: #1e1a3a;
  margin: 24px 0 12px;
  letter-spacing: -.01em
}

.masterclass-detail .description-block h3 {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  color: #4B3F9B;
  margin: 24px 0 12px
}

.masterclass-detail .description-block blockquote {
  border-top: 2px solid #AA92C9;
  border-bottom: 2px solid #AA92C9;
  margin: 24px 0;
  padding: 12px 24px;
  background: #F7F4FA;
  border-radius: 2px
}

.masterclass-detail .description-block blockquote p {
  font-size: 18px;
  font-style: italic;
  color: #4B3F9B;
  margin: 0
}

.masterclass-detail .description-block blockquote::before {
  content: "\201C";
  font-size: 36px;
  font-weight: 900;
  color: #AA92C9;
  line-height: 1;
  display: block;
  margin-bottom: 6px
}

.masterclass-detail .description-block blockquote::after {
  content: "\201D";
  font-size: 36px;
  font-weight: 900;
  color: #AA92C9;
  line-height: 1;
  display: block;
  margin-top: 6px;
  text-align: right
}

.masterclass-detail .description-block mark {
  background: linear-gradient(90deg, #4b3f9b26 0%, #aa92c933 100%);
  color: #1e1a3a;
  padding: 0 4px;
  border-radius: 2px
}

.masterclass-detail .description-block ol {
  padding-left: 24px;
  margin: 12px 0
}

.masterclass-detail .description-block ol li {
  font-size: 16px;
  line-height: 1.65;
  color: #2e2850;
  margin-bottom: 6px
}

.masterclass-detail .description-block cite {
  font-size: 14px;
  color: #7a6aaa;
  font-style: italic
}

.masterclass-detail .program-block {
  background: #fff;
  border-radius: 2px;
  padding: 48px;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f
}

.masterclass-detail .program-block__heading {
  font-size: 24px;
  font-weight: 900;
  line-height: 1.15;
  letter-spacing: -.01em;
  color: #1e1a3a;
  margin: 0 0 24px
}

.masterclass-detail .program-block p {
  font-size: 16px;
  line-height: 1.65;
  color: #2e2850;
  margin: 0 0 12px
}

.masterclass-detail .program-block h2 {
  font-size: 18px;
  font-weight: 800;
  line-height: 1.4;
  color: #1e1a3a;
  margin: 24px 0 12px;
  letter-spacing: -.01em
}

.masterclass-detail .program-block h3 {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  color: #4B3F9B;
  margin: 16px 0 6px
}

.masterclass-detail .program-block ol {
  padding-left: 0;
  list-style: none;
  margin: 12px 0;
  counter-reset: prog-counter
}

.masterclass-detail .program-block ol li {
  font-size: 16px;
  line-height: 1.65;
  color: #2e2850;
  margin-bottom: 12px;
  padding-left: 36px;
  position: relative;
  counter-increment: prog-counter
}

.masterclass-detail .program-block ol li::before {
  content: counter(prog-counter);
  position: absolute;
  left: 0;
  top: 2px;
  width: 22px;
  height: 22px;
  background: #4B3F9B;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1
}

.masterclass-detail .program-block li {
  font-size: 16px;
  line-height: 1.65;
  color: #2e2850;
  margin-bottom: 6px
}

.masterclass-detail .program-block strong {
  color: #1e1a3a;
  font-weight: 700
}

.masterclass-detail .program-block blockquote {
  border-top: 2px solid #AA92C9;
  border-bottom: 2px solid #AA92C9;
  margin: 24px 0;
  padding: 12px 24px;
  background: #F7F4FA;
  border-radius: 2px
}

.masterclass-detail .program-block dl {
  margin: 12px 0
}

.masterclass-detail .program-block dt {
  font-size: 16px;
  font-weight: 700;
  color: #4B3F9B;
  margin-top: 12px
}

.masterclass-detail .program-block dd {
  font-size: 16px;
  line-height: 1.65;
  color: #2e2850;
  margin-left: 24px
}

.masterclass-detail .program-block details {
  border: 1px solid #AA92C9;
  border-radius: 2px;
  margin-bottom: 12px;
  overflow: hidden
}

.masterclass-detail .program-block summary {
  font-size: 16px;
  font-weight: 700;
  color: #4B3F9B;
  padding: 12px 24px;
  cursor: pointer;
  background: #F7F4FA;
  transition: background .15s ease-out
}

.masterclass-detail .program-block summary:hover {
  background: #ede8f5
}

.masterclass-detail .program-block details[open] {
  padding-bottom: 12px
}

.masterclass-detail .program-block details[open] summary {
  border-bottom: 1px solid #AA92C9;
  margin-bottom: 12px
}

.masterclass-detail .body-sidebar {
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: sticky;
  top: 72px
}

.masterclass-detail .pricing-card {
  background: #fff;
  border-radius: 2px;
  padding: 24px;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c;
  position: relative;
  overflow: hidden
}

.masterclass-detail .pricing-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #4B3F9B 0%, #AA92C9 100%)
}

.masterclass-detail .pricing-card__label {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .08em;
  color: #7a6aaa;
  margin-bottom: 12px;
  line-height: 1.15
}

.masterclass-detail .pricing-card__price {
  font-size: 36px;
  font-weight: 900;
  color: #1e1a3a;
  line-height: 1.15;
  letter-spacing: -.02em;
  margin-bottom: 6px
}

.masterclass-detail .pricing-card__terms {
  font-size: 14px;
  color: #7a6aaa;
  line-height: 1.4;
  margin-bottom: 24px
}

.masterclass-detail .pricing-card__cta {
  display: block;
  width: 100%;
  background: #4B3F9B;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .04em;
  border: none;
  border-radius: 2px;
  padding: 12px 24px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  transition: background .15s ease-out, box-shadow .15s ease-out;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  line-height: 1.4
}

.masterclass-detail .pricing-card__cta:hover {
  background: linear-gradient(90deg, #4B3F9B 0%, #65b 100%);
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.masterclass-detail .pricing-card__cta:focus {
  outline: 2px solid #4B3F9B;
  outline-offset: 2px
}

.masterclass-detail .pricing-table {
  background: #fff;
  border-radius: 2px;
  overflow: hidden;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f
}

.masterclass-detail .pricing-table__heading {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .08em;
  color: #4B3F9B;
  padding: 12px 24px;
  background: #F7F4FA;
  border-bottom: 1px solid #AA92C9;
  line-height: 1.15
}

.masterclass-detail .pricing-table table {
  width: 100%;
  border-collapse: collapse
}

.masterclass-detail .pricing-table th {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
  color: #7a6aaa;
  padding: 12px;
  text-align: left;
  background: #F7F4FA;
  border-bottom: 1px solid #e8e0f2
}

.masterclass-detail .pricing-table td {
  font-size: 14px;
  color: #2e2850;
  padding: 12px;
  border-bottom: 1px solid #f0ebf8;
  line-height: 1.4;
  vertical-align: middle
}

.masterclass-detail .pricing-table tr:last-child td {
  border-bottom: none
}

.masterclass-detail .pricing-table tr:hover td {
  background: #F7F4FA;
  transition: background .12s ease-out
}

.masterclass-detail .pricing-table .plan--active td {
  background: linear-gradient(90deg, #4b3f9b0f 0%, #aa92c914 100%);
  font-weight: 700;
  color: #1e1a3a
}

.masterclass-detail .pricing-table .plan--active td:first-child {
  position: relative
}

.masterclass-detail .pricing-table .plan--active td:first-child::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: #4B3F9B;
  border-radius: 0 2px 2px 0
}

.masterclass-detail .check-mark {
  display: inline-block;
  width: 16px;
  height: 16px;
  position: relative
}

.masterclass-detail .check-mark svg {
  width: 16px;
  height: 16px
}

.masterclass-detail .poll-card {
  background: #fff;
  border-radius: 2px;
  padding: 24px;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f
}

.masterclass-detail .poll-card__heading {
  font-size: 16px;
  font-weight: 800;
  color: #1e1a3a;
  line-height: 1.4;
  margin-bottom: 6px;
  letter-spacing: -.01em
}

.masterclass-detail .poll-card__sub {
  font-size: 14px;
  color: #7a6aaa;
  line-height: 1.4;
  margin-bottom: 24px
}

.masterclass-detail .poll-option {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  cursor: pointer
}

.masterclass-detail .poll-option:last-of-type {
  margin-bottom: 0
}

.masterclass-detail .poll-option input[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  border: 2px solid #AA92C9;
  border-radius: 50%;
  flex-shrink: 0;
  cursor: pointer;
  transition: border-color .15s ease-out, background .15s ease-out;
  position: relative
}

.masterclass-detail .poll-option input[type="radio"]:checked {
  border-color: #4B3F9B;
  background: #4B3F9B;
  box-shadow: inset 0 0 0 4px #fff
}

.masterclass-detail .poll-option input[type="radio"]:focus {
  outline: 2px solid #4B3F9B;
  outline-offset: 2px
}

.masterclass-detail .poll-option__text {
  font-size: 16px;
  line-height: 1.4;
  color: #2e2850;
  transition: color .12s ease-out
}

.masterclass-detail .poll-option input[type="radio"]:checked+.poll-option__text {
  color: #4B3F9B;
  font-weight: 700
}

.masterclass-detail .poll-option:has(input:checked) {
  background: linear-gradient(90deg, #4b3f9b0f 0%, #aa92c914 100%);
  border-radius: 2px;
  padding: 6px;
  margin-left: -6px;
  margin-right: -6px
}

@keyframes driftShadow {
  0% {
    transform: translateX(-30%) translateY(0);
    opacity: .07
  }

  50% {
    transform: translateX(10%) translateY(-15%);
    opacity: .12
  }

  100% {
    transform: translateX(-30%) translateY(0);
    opacity: .07
  }
}

.masterclass-detail .body-frame {
  position: relative
}

.masterclass-detail .body-frame::before {
  content: "";
  position: absolute;
  top: -48px;
  left: 10%;
  width: 60%;
  height: 300px;
  background: radial-gradient(ellipse 70% 60% at 40% 50%, #4b3f9b17 0%, transparent 70%);
  pointer-events: none;
  animation: driftShadow 9s ease-in-out infinite
}

@media (max-width: 900px) {
  .masterclass-detail .title-grid {
    grid-template-columns: 1fr;
    gap: 24px
  }

  .masterclass-detail .title-text {
    padding: 24px 24px 24px 48px
  }

  .masterclass-detail .title-image-strip {
    height: 280px
  }

  .masterclass-detail .body-grid {
    grid-template-columns: 1fr;
    gap: 24px
  }

  .masterclass-detail .body-sidebar {
    position: static
  }

  .masterclass-detail .description-block,
  .masterclass-detail .program-block {
    padding: 24px
  }
}

@media (max-width: 600px) {
  .masterclass-detail .title-heading {
    font-size: 24px
  }

  .masterclass-detail .article-frame {
    padding: 24px 12px 0
  }

  .masterclass-detail .body-grid {
    padding: 0 12px
  }

  .masterclass-detail .reading-bar {
    padding: 12px;
    gap: 12px
  }

  .masterclass-detail .pricing-table th,
  .masterclass-detail .pricing-table td {
    font-size: 13px;
    padding: 6px
  }
}

.blog-detail {
  max-width: 100%;
  overflow-x: hidden
}

.blog-detail .reading-frame {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px
}

.blog-detail .post-banner {
  position: relative;
  padding: 48px 0 0
}

.blog-detail .post-banner__frame {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 1fr 1.6fr;
  gap: 48px;
  align-items: stretch;
  min-height: 340px
}

.blog-detail .post-banner__image-col {
  position: relative;
  border-radius: 24px;
  overflow: hidden
}

.blog-detail .post-banner__image-col::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, #4b3f9b2e 0%, transparent 100%);
  z-index: 1;
  transition: opacity .2s ease-out
}

.blog-detail .post-banner__image-col:hover::before {
  opacity: 0
}

.blog-detail .post-banner__image-col img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: grayscale(30%);
  transition: filter .2s ease-out
}

.blog-detail .post-banner__image-col:hover img {
  filter: grayscale(0%)
}

.blog-detail .post-banner__deco-border {
  position: absolute;
  inset: -6px;
  border: 2px solid #4b3f9b38;
  border-radius: 24px;
  pointer-events: none;
  z-index: 2
}

.blog-detail .post-banner__text-col {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 48px 24px 48px 0;
  position: relative
}

.blog-detail .post-banner__text-col::before {
  content: "";
  position: absolute;
  top: 24px;
  left: -12px;
  width: 2px;
  height: calc(100% - 48px);
  background: linear-gradient(to bottom, #4B3F9B 0%, transparent 100%);
  border-radius: 2px
}

.blog-detail .post-banner__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px
}

.blog-detail .post-banner__tag {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .08em;
  color: #4B3F9B;
  background: #F7F4FA;
  border: 1px solid #4b3f9b33;
  border-radius: 2px;
  padding: 6px 12px
}

.blog-detail .post-banner__readtime {
  font-size: 14px;
  color: #6a5fa8;
  letter-spacing: .04em
}

.blog-detail .post-banner__heading {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #1e1a3a;
  letter-spacing: -.02em;
  margin: 0 0 12px
}

.blog-detail .post-banner__sub {
  font-size: 18px;
  line-height: 1.65;
  color: #4a4468;
  margin: 0
}

.blog-detail .post-banner__author-line {
  margin-top: 24px;
  font-size: 14px;
  color: #7a6fb0;
  letter-spacing: .03em
}

.blog-detail .post-banner__author-line strong {
  color: #4B3F9B;
  font-weight: 700
}

.blog-detail .post-banner__deco-frame {
  position: absolute;
  top: 12px;
  right: -6px;
  bottom: 12px;
  width: 3px;
  background: linear-gradient(to bottom, #AA92C9, transparent);
  border-radius: 2px;
  pointer-events: none
}

.blog-detail .divider-gradient {
  height: 2px;
  background: linear-gradient(to right, #4B3F9B 0%, transparent 60%);
  max-width: 1140px;
  margin: 48px auto;
  padding: 0 24px;
  border: none
}

.blog-detail .article-body {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 48px;
  align-items: start
}

.blog-detail .article-body__prose {
  position: relative
}

.blog-detail .article-body__prose-curve {
  position: absolute;
  top: 0;
  left: -36px;
  width: 24px;
  height: 80px;
  pointer-events: none
}

.blog-detail .article-body__prose p {
  font-size: 18px;
  line-height: 1.85;
  color: #2a2545;
  margin: 0 0 24px
}

.blog-detail .article-body__prose h2 {
  font-size: 24px;
  line-height: 1.4;
  font-weight: 900;
  color: #1e1a3a;
  letter-spacing: -.01em;
  margin: 48px 0 12px
}

.blog-detail .article-body__prose h3 {
  font-size: 18px;
  line-height: 1.4;
  font-weight: 800;
  color: #2e2860;
  margin: 24px 0 12px
}

.blog-detail .article-body__prose h4 {
  font-size: 16px;
  line-height: 1.4;
  font-weight: 700;
  color: #4B3F9B;
  margin: 24px 0 6px
}

.blog-detail .article-body__prose em {
  color: #4B3F9B;
  font-style: italic
}

.blog-detail .article-body__prose ol {
  padding-left: 24px;
  margin: 0 0 24px
}

.blog-detail .article-body__prose ol li {
  font-size: 18px;
  line-height: 1.65;
  color: #2a2545;
  margin-bottom: 12px
}

.blog-detail .article-body__prose table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
  font-size: 16px
}

.blog-detail .article-body__prose caption {
  font-size: 14px;
  color: #7a6fb0;
  text-align: left;
  margin-bottom: 6px;
  letter-spacing: .04em
}

.blog-detail .article-body__prose thead th {
  background: #4B3F9B;
  color: #fff;
  padding: 12px;
  text-align: left;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .04em
}

.blog-detail .article-body__prose tbody td {
  padding: 12px;
  border-bottom: 1px solid #aa92c933;
  color: #2a2545;
  vertical-align: top
}

.blog-detail .article-body__prose tbody tr:nth-child(even) td {
  background: #F7F4FA
}

.blog-detail .article-body__prose tfoot td {
  padding: 12px;
  font-size: 14px;
  color: #6a5fa8;
  font-style: italic
}

.blog-detail .article-body__prose details {
  background: #F7F4FA;
  border-radius: 2px;
  padding: 12px 24px;
  margin: 24px 0;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f
}

.blog-detail .article-body__prose summary {
  font-size: 16px;
  font-weight: 700;
  color: #4B3F9B;
  cursor: pointer;
  padding: 6px 0;
  letter-spacing: .02em
}

.blog-detail .article-body__prose details[open] summary {
  margin-bottom: 12px
}

.blog-detail .article-sidebar {
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: sticky;
  top: 24px
}

.blog-detail .sidebar-poll {
  background: #F7F4FA;
  border-radius: 24px;
  padding: 24px;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.blog-detail .sidebar-poll__heading {
  font-size: 16px;
  font-weight: 800;
  color: #1e1a3a;
  margin: 0 0 6px;
  letter-spacing: -.01em
}

.blog-detail .sidebar-poll__sub {
  font-size: 14px;
  color: #7a6fb0;
  margin: 0 0 24px;
  line-height: 1.4
}

.blog-detail .poll-form {
  display: flex;
  flex-direction: column;
  gap: 12px
}

.blog-detail .poll-form__option {
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer
}

.blog-detail .poll-form__option input[type="radio"] {
  appearance: none;
  width: 20px;
  height: 20px;
  border: 2px solid #AA92C9;
  border-radius: 50%;
  flex-shrink: 0;
  cursor: pointer;
  transition: border-color .15s ease-out, background .15s ease-out;
  position: relative
}

.blog-detail .poll-form__option input[type="radio"]:checked {
  border-color: #4B3F9B;
  background: #4B3F9B;
  box-shadow: inset 0 0 0 4px #F7F4FA
}

.blog-detail .poll-form__option input[type="radio"]:focus {
  outline: 2px solid #4B3F9B;
  outline-offset: 2px
}

.blog-detail .poll-form__label {
  font-size: 16px;
  color: #2a2545;
  line-height: 1.4;
  cursor: pointer;
  transition: color .15s ease-out
}

.blog-detail .poll-form__option:has(input:checked) .poll-form__label {
  color: #4B3F9B;
  font-weight: 700
}

.blog-detail .poll-form__option:has(input:checked) {
  background: #4b3f9b0f;
  border-radius: 2px;
  padding: 6px;
  margin: -6px
}

.blog-detail .sidebar-meta {
  background: #fff;
  border-radius: 24px;
  padding: 24px;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  border: 1px solid #aa92c933
}

.blog-detail .sidebar-meta__label {
  font-size: 14px;
  letter-spacing: .08em;
  color: #AA92C9;
  font-weight: 600;
  margin: 0 0 6px
}

.blog-detail .sidebar-meta__value {
  font-size: 16px;
  color: #2a2545;
  font-weight: 700;
  margin: 0 0 24px
}

.blog-detail .sidebar-meta__value:last-child {
  margin-bottom: 0
}

.blog-detail .report-error-anchor {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  color: #6a5fa8;
  text-decoration: none;
  padding: 12px 24px;
  border: 1px solid #4b3f9b33;
  border-radius: 2px;
  background: #fff;
  transition: background .15s ease-out, color .15s ease-out, box-shadow .15s ease-out;
  width: 100%;
  justify-content: center;
  letter-spacing: .03em
}

.blog-detail .report-error-anchor:hover {
  background: linear-gradient(to right, #4B3F9B, #AA92C9);
  color: #fff;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.blog-detail .report-error-anchor:focus {
  outline: 2px solid #4B3F9B;
  outline-offset: 2px
}

.blog-detail .report-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0
}

.blog-detail .divider-dots {
  max-width: 1140px;
  margin: 48px auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  gap: 12px
}

.blog-detail .divider-dots__line {
  flex: 1;
  height: 1px;
  background: linear-gradient(to right, #aa92c966, transparent)
}

.blog-detail .divider-dots__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #AA92C9;
  flex-shrink: 0
}

.blog-detail .insight-strip {
  position: relative;
  background: #1e1a3a;
  padding: 96px 0;
  overflow: hidden
}

.blog-detail .insight-strip__bg {
  position: absolute;
  inset: 0;
  background: url(https://images.unsplash.com/photo-1551288049-bebda4e38f71?w=1400&q=80) center/cover no-repeat;
  filter: grayscale(100%);
  opacity: .12;
  pointer-events: none
}

.blog-detail .insight-strip__vignette {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 80% 60% at 50% 50%, transparent 30%, #1e1a3ad9 100%);
  pointer-events: none;
  animation: vignette-breathe 4s ease-in-out infinite
}

@keyframes vignette-breathe {

  0%,
  100% {
    opacity: 1
  }

  50% {
    opacity: .6
  }
}

.blog-detail .insight-strip__frame {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1.4fr 1.8fr;
  gap: 24px;
  align-items: start
}

.blog-detail .insight-card {
  background: #f7f4fa0f;
  border: 1px solid #aa92c933;
  border-radius: 24px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: background .2s ease-out, box-shadow .2s ease-out
}

.blog-detail .insight-card:hover {
  background: #f7f4fa1a;
  box-shadow: 1px 9px 48px 0 #4b3f9b1f
}

.blog-detail .insight-card__number {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #4B3F9B;
  color: #fff;
  font-size: 16px;
  font-weight: 900;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.blog-detail .insight-card__heading {
  font-size: 16px;
  font-weight: 800;
  color: #fff;
  margin: 0;
  line-height: 1.4;
  letter-spacing: -.01em
}

.blog-detail .insight-card__text {
  font-size: 14px;
  line-height: 1.65;
  color: #f7f4fabf;
  margin: 0
}

.blog-detail .insight-card__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px
}

.blog-detail .insight-card__badge {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .04em;
  color: #AA92C9;
  background: #aa92c91f;
  border: 1px solid #aa92c940;
  border-radius: 2px;
  padding: 6px 12px
}

.blog-detail .insight-card__quote {
  font-size: 14px;
  line-height: 1.65;
  color: #f7f4fab3;
  margin: 6px 0 0;
  font-style: italic
}

.blog-detail .insight-card__quote::before {
  content: "\201C";
  color: #AA92C9;
  font-size: 24px;
  font-style: normal;
  line-height: 1;
  display: block;
  margin-bottom: 6px
}

.blog-detail .insight-card__quote::after {
  content: "\201D";
  color: #AA92C9;
  font-size: 24px;
  font-style: normal
}

.blog-detail .insight-card--complex {
  gap: 12px
}

.blog-detail .insight-card__counter-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 6px
}

.blog-detail .insight-card__counter {
  font-size: 36px;
  font-weight: 900;
  color: #AA92C9;
  line-height: 1.15
}

.blog-detail .insight-card__counter-label {
  font-size: 14px;
  color: #f7f4fa99;
  line-height: 1.4
}

@media (max-width: 900px) {
  .blog-detail .post-banner__frame {
    grid-template-columns: 1fr;
    min-height: auto
  }

  .blog-detail .post-banner__image-col {
    height: 260px
  }

  .blog-detail .post-banner__text-col {
    padding: 24px 0 0
  }

  .blog-detail .post-banner__text-col::before {
    display: none
  }

  .blog-detail .article-body {
    grid-template-columns: 1fr
  }

  .blog-detail .article-sidebar {
    position: static
  }

  .blog-detail .insight-strip__frame {
    grid-template-columns: 1fr
  }
}

@media (max-width: 600px) {
  .blog-detail .post-banner__heading {
    font-size: 24px
  }

  .blog-detail .article-body__prose h2 {
    font-size: 18px
  }

  .blog-detail .insight-strip {
    padding: 48px 0
  }
}

@keyframes gradientShift {
  0% {
    background-position: 0 50%
  }

  50% {
    background-position: 100% 50%
  }

  100% {
    background-position: 0 50%
  }
}

.services {
  overflow-x: clip;
  background: #fff
}

.services .title-block {
  padding: 96px 24px 48px;
  background: #F7F4FA;
  position: relative;
  background-size: 400% 400%;
  animation: gradientShift 12s linear infinite;
  background-image: linear-gradient(135deg, #F7F4FA 0%, #ede8f5 40%, #F7F4FA 100%)
}

.services .title-block__pattern {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none
}

.services .title-block__pattern svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: .06
}

.services .title-block__bracket {
  display: inline-block;
  width: 18px;
  height: 18px;
  border-top: 2px solid #4B3F9B;
  border-left: 2px solid #4B3F9B;
  position: absolute
}

.services .title-block__bracket--tr {
  top: 24px;
  right: 24px;
  border-top: 2px solid #4B3F9B;
  border-left: none;
  border-right: 2px solid #4B3F9B
}

.services .title-block__bracket--bl {
  bottom: 24px;
  left: 24px;
  border-top: none;
  border-bottom: 2px solid #4B3F9B;
  border-left: 2px solid #4B3F9B
}

.services .title-block__bracket--br {
  bottom: 24px;
  right: 24px;
  border-top: none;
  border-bottom: 2px solid #4B3F9B;
  border-left: none;
  border-right: 2px solid #4B3F9B
}

.services .title-block__inner {
  max-width: 1140px;
  margin: 0 auto;
  position: relative;
  z-index: 1
}

.services .title-block__label {
  font-size: 14px;
  letter-spacing: .12em;
  color: #4B3F9B;
  text-transform: uppercase;
  margin-bottom: 24px;
  display: block;
  line-height: 1.4
}

.services .title-block__heading {
  font-size: 70px;
  line-height: 1.15;
  font-weight: 900;
  color: #1e1840;
  letter-spacing: -.02em;
  margin: 0 0 24px;
  max-width: 780px
}

.services .title-block__heading span {
  display: block;
  color: #4B3F9B
}

.services .title-block__sub {
  font-size: 18px;
  line-height: 1.65;
  color: #3d3460;
  max-width: 560px;
  margin: 0
}

.services .divider-curve {
  width: 100%;
  overflow: hidden;
  line-height: 0;
  background: #F7F4FA
}

.services .divider-curve svg {
  display: block;
  width: 100%
}

.services .catalog-band {
  background: #fff;
  padding: 48px 24px 96px
}

.services .catalog-band__inner {
  max-width: 1140px;
  margin: 0 auto
}

.services .catalog-band__eyebrow {
  font-size: 14px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #AA92C9;
  margin-bottom: 12px;
  display: block;
  line-height: 1.4
}

.services .catalog-band__heading {
  font-size: 36px;
  font-weight: 800;
  color: #1e1840;
  line-height: 1.15;
  letter-spacing: -.01em;
  margin: 0 0 48px
}

.services .card-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px
}

.services .program-card {
  background: #fff;
  border-radius: 24px;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow .18s ease-out, transform .15s ease-out
}

.services .program-card:hover {
  box-shadow: 1px 9px 48px 0 #4b3f9b1f;
  transform: translateY(-2px)
}

.services .program-card__image-wrap {
  position: relative;
  height: 200px;
  overflow: hidden
}

.services .program-card__image-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .2s ease-out
}

.services .program-card:hover .program-card__image-wrap img {
  transform: scale(1.03)
}

.services .program-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, #4b3f9b8c, #aa92c940);
  transition: opacity .18s ease-out
}

.services .program-card:hover .program-card__overlay {
  opacity: 0
}

.services .program-card__badge {
  position: absolute;
  top: 12px;
  right: 12px;
  background: #4B3F9B;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  padding: 6px 12px;
  border-radius: 2px;
  line-height: 1.4
}

.services .program-card__body {
  padding: 24px;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px
}

.services .program-card__title {
  font-size: 18px;
  font-weight: 800;
  color: #1e1840;
  line-height: 1.4;
  letter-spacing: -.01em;
  margin: 0
}

.services .program-card__desc {
  font-size: 16px;
  line-height: 1.65;
  color: #4a4270;
  margin: 0
}

.services .program-card__meta {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 6px
}

.services .meta-pill {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  color: #4B3F9B;
  background: #F7F4FA;
  border-radius: 2px;
  padding: 6px 12px;
  line-height: 1.4
}

.services .meta-pill svg {
  flex-shrink: 0
}

.services .program-card__seats {
  font-size: 14px;
  color: #AA92C9;
  line-height: 1.4
}

.services .program-card__footer {
  padding: 0 24px 24px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px
}

.services .program-card__price-block {
  display: flex;
  flex-direction: column;
  gap: 6px
}

.services .program-card__price {
  font-size: 24px;
  font-weight: 900;
  color: #1e1840;
  line-height: 1.15
}

.services .program-card__price-desc {
  font-size: 14px;
  color: #AA92C9;
  line-height: 1.4
}

.services .program-card__cta {
  display: inline-block;
  background: #4B3F9B;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  padding: 12px 24px;
  border-radius: 2px;
  text-decoration: none;
  line-height: 1.4;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  transition: box-shadow .18s ease-out, background .15s ease
}

.services .program-card__cta:hover {
  background: linear-gradient(to right, #4B3F9B, #6b5dc0);
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.services .divider-flat {
  height: 2px;
  background: linear-gradient(to right, #4B3F9B, #AA92C9, #F7F4FA);
  border: none;
  margin: 0
}

.services .method-band {
  background: #F7F4FA;
  padding: 96px 24px;
  position: relative
}

.services .method-band__vignette {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, transparent 55%, #4b3f9b12 100%);
  pointer-events: none
}

.services .method-band__inner {
  max-width: 1140px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 96px;
  align-items: start;
  position: relative;
  z-index: 1
}

.services .method-band__text-col {
  display: flex;
  flex-direction: column;
  gap: 24px
}

.services .method-band__eyebrow {
  font-size: 14px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #AA92C9;
  line-height: 1.4
}

.services .method-band__heading {
  font-size: 36px;
  font-weight: 800;
  color: #1e1840;
  line-height: 1.15;
  letter-spacing: -.01em;
  margin: 0
}

.services .method-band__body {
  font-size: 16px;
  line-height: 1.65;
  color: #3d3460;
  margin: 0
}

.services .method-band__quote-wrap {
  border-radius: 24px;
  background: #fff;
  padding: 48px;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c;
  position: relative
}

.services .method-band__quote-mark {
  font-size: 70px;
  line-height: 1;
  color: #4B3F9B;
  font-weight: 900;
  position: absolute;
  top: 12px;
  left: 24px
}

.services .method-band__quote-text {
  font-size: 18px;
  line-height: 1.65;
  color: #1e1840;
  font-style: italic;
  margin: 0 0 24px;
  padding-top: 36px
}

.services .method-band__quote-author {
  font-size: 14px;
  color: #AA92C9;
  letter-spacing: .08em;
  text-transform: uppercase;
  line-height: 1.4
}

.services .steps-band {
  background: #1e1840;
  padding: 96px 24px;
  position: relative;
  overflow: hidden
}

.services .steps-band__texture {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden
}

.services .steps-band__inner {
  max-width: 1140px;
  margin: 0 auto;
  position: relative;
  z-index: 1
}

.services .steps-band__heading {
  font-size: 36px;
  font-weight: 800;
  color: #fff;
  line-height: 1.15;
  letter-spacing: -.01em;
  margin: 0 0 48px;
  max-width: 560px
}

.services .steps-trail {
  display: flex;
  flex-direction: column;
  gap: 0
}

.services .step-item {
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: flex-start
}

.services .step-item__dot-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0
}

.services .step-item__dot {
  width: 16px;
  height: 16px;
  border-radius: 24px;
  background: #AA92C9;
  border: 2px solid #4B3F9B;
  flex-shrink: 0;
  transition: background .15s ease-out
}

.services .step-item:hover .step-item__dot {
  background: #4B3F9B
}

.services .step-item__line {
  width: 2px;
  flex: 1;
  min-height: 48px;
  background: linear-gradient(to bottom, #4B3F9B, #AA92C9)
}

.services .step-item--last .step-item__line {
  display: none
}

.services .step-item__content {
  padding-bottom: 48px;
  flex: 1
}

.services .step-item--last .step-item__content {
  padding-bottom: 0
}

.services .step-item__num {
  font-size: 14px;
  letter-spacing: .1em;
  color: #AA92C9;
  text-transform: uppercase;
  margin-bottom: 6px;
  line-height: 1.4
}

.services .step-item__title {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  line-height: 1.4;
  margin: 0 0 6px
}

.services .step-item__desc {
  font-size: 16px;
  line-height: 1.65;
  color: #b8aed4;
  margin: 0
}

.services .divider-wave {
  background: #1e1840;
  line-height: 0;
  overflow: hidden
}

.services .divider-wave svg {
  display: block;
  width: 100%
}

.services .contact-band {
  background: #fff;
  padding: 96px 24px
}

.services .contact-band__inner {
  max-width: 1140px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 96px;
  align-items: start
}

.services .contact-band__left {
  display: flex;
  flex-direction: column;
  gap: 24px
}

.services .contact-band__eyebrow {
  font-size: 14px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #AA92C9;
  line-height: 1.4
}

.services .contact-band__heading {
  font-size: 36px;
  font-weight: 800;
  color: #1e1840;
  line-height: 1.15;
  letter-spacing: -.01em;
  margin: 0
}

.services .contact-band__body {
  font-size: 16px;
  line-height: 1.65;
  color: #3d3460;
  margin: 0
}

.services .contact-band__accent-bar {
  width: 4px;
  height: 48px;
  background: linear-gradient(to bottom, #4B3F9B, #AA92C9);
  border-radius: 2px
}

.services .contact-form {
  display: flex;
  flex-direction: column;
  gap: 24px
}

.services .form-field {
  display: flex;
  flex-direction: column;
  gap: 6px
}

.services .form-field__label {
  font-size: 14px;
  font-weight: 600;
  color: #1e1840;
  letter-spacing: .04em;
  line-height: 1.4
}

.services .form-field__input,
.services .form-field__textarea {
  background: #F7F4FA;
  border: 1.5px solid #e0d8f0;
  border-radius: 2px;
  padding: 12px;
  font-size: 16px;
  color: #1e1840;
  line-height: 1.4;
  outline: none;
  transition: border-color .15s ease-out, box-shadow .18s ease-out;
  box-shadow: inset 2px 3px 6px 0 #4b3f9b0a;
  width: 100%;
  box-sizing: border-box
}

.services .form-field__input::placeholder,
.services .form-field__textarea::placeholder {
  color: #b8aed4;
  transition: opacity .2s ease-out
}

.services .form-field__input:focus::placeholder,
.services .form-field__textarea:focus::placeholder {
  opacity: 0
}

.services .form-field__input:focus,
.services .form-field__textarea:focus {
  border-color: #4B3F9B;
  box-shadow: inset 2px 3px 6px 0 #4b3f9b0a 1px 2px 2px 0 #4b3f9b0f
}

.services .form-field__textarea {
  resize: vertical;
  min-height: 120px
}

.services .form-submit {
  background: #4B3F9B;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  padding: 12px 48px;
  border-radius: 2px;
  border: none;
  cursor: pointer;
  line-height: 1.4;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  transition: box-shadow .18s ease-out, background .15s ease;
  align-self: flex-start;
  type: submit
}

.services .form-submit:hover {
  background: linear-gradient(to right, #4B3F9B, #6b5dc0);
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.services .form-submit:focus {
  outline: 2px solid #4B3F9B;
  outline-offset: 2px
}

@media (max-width: 900px) {
  .services .title-block__heading {
    font-size: 36px
  }

  .services .card-grid {
    grid-template-columns: 1fr
  }

  .services .method-band__inner {
    grid-template-columns: 1fr;
    gap: 48px
  }

  .services .contact-band__inner {
    grid-template-columns: 1fr;
    gap: 48px
  }
}

@media (max-width: 600px) {
  .services .title-block {
    padding: 48px 24px
  }

  .services .title-block__heading {
    font-size: 24px
  }

  .services .program-card__footer {
    flex-direction: column;
    align-items: flex-start
  }
}

.masterclass {
  background: #fff;
  overflow-x: hidden
}

.masterclass .split-screen {
  display: flex;
  flex-direction: row;
  min-height: 520px
}

.masterclass .split-screen__text-zone {
  flex: 1 1 55%;
  background: #4B3F9B;
  padding: 96px 48px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative
}

.masterclass .split-screen__quote-mark {
  position: absolute;
  top: 48px;
  left: 48px;
  font-size: 70px;
  line-height: 1.15;
  color: #AA92C9;
  opacity: .28;
  pointer-events: none;
  user-select: none;
  font-weight: 900;
  letter-spacing: -2px
}

.masterclass .split-screen__eyebrow {
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: .12em;
  color: #AA92C9;
  text-transform: uppercase;
  margin-bottom: 24px
}

.masterclass .split-screen__heading {
  font-size: 70px;
  line-height: 1.15;
  color: #fff;
  font-weight: 900;
  letter-spacing: -1.5px;
  margin-bottom: 24px
}

.masterclass .split-screen__subheading {
  font-size: 24px;
  line-height: 1.4;
  color: #F7F4FA;
  font-weight: 400;
  margin-bottom: 24px
}

.masterclass .split-screen__description {
  font-size: 16px;
  line-height: 1.65;
  color: #d4cce8;
  max-width: 480px
}

.masterclass .split-screen__image-zone {
  flex: 1 1 45%;
  position: relative;
  min-height: 400px;
  overflow: hidden
}

.masterclass .split-screen__image-zone img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(1.1) brightness(0.88) sepia(0.18);
  transition: filter .18s ease-out
}

.masterclass .split-screen__image-zone:hover img {
  filter: saturate(1.2) brightness(0.96) sepia(0.08)
}

.masterclass .split-screen__image-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, #4b3f9b61, #aa92c91f);
  pointer-events: none
}

.masterclass .divider-heavy {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 0 48px;
  margin: 0
}

.masterclass .divider-heavy__thick {
  height: 3px;
  background: #4B3F9B;
  border-radius: 2px
}

.masterclass .divider-heavy__thin {
  height: 1px;
  background: #AA92C9;
  opacity: .45
}

.masterclass .cards-grid-area {
  max-width: 1140px;
  margin: 0 auto;
  padding: 96px 48px
}

.masterclass .cards-grid-area__label {
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: .14em;
  color: #4B3F9B;
  text-transform: uppercase;
  margin-bottom: 12px
}

.masterclass .cards-grid-area__heading {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #1e1845;
  letter-spacing: -.5px;
  margin-bottom: 48px;
  max-width: 600px
}

.masterclass .cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px
}

.masterclass .material-card {
  border-radius: 24px;
  background: #F7F4FA;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: box-shadow .18s ease-out, transform .15s ease-out
}

.masterclass .material-card:hover {
  box-shadow: 1px 9px 48px 0 #4b3f9b1f;
  transform: translateY(-3px)
}

.masterclass .material-card__image-wrap {
  position: relative;
  height: 180px;
  overflow: hidden;
  flex-shrink: 0
}

.masterclass .material-card__image-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.85) sepia(0.14) saturate(1.1);
  transition: filter .18s ease-out
}

.masterclass .material-card:hover .material-card__image-wrap img {
  filter: brightness(0.97) sepia(0.04) saturate(1.15)
}

.masterclass .material-card__image-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, #4b3f9b52, #aa92c924);
  pointer-events: none;
  transition: opacity .18s ease-out
}

.masterclass .material-card:hover .material-card__image-overlay {
  opacity: .5
}

.masterclass .material-card__badge {
  position: absolute;
  top: 12px;
  right: 12px;
  background: #4B3F9B;
  color: #fff;
  font-size: 14px;
  line-height: 1.4;
  padding: 6px 12px;
  border-radius: 2px;
  font-weight: 700;
  letter-spacing: .04em
}

.masterclass .material-card__body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 12px
}

.masterclass .material-card__meta {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: center
}

.masterclass .material-card__meta-item {
  font-size: 14px;
  line-height: 1.4;
  color: #7a6ab5;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 6px
}

.masterclass .material-card__meta-icon {
  width: 14px;
  height: 14px;
  flex-shrink: 0
}

.masterclass .material-card__heading {
  font-size: 18px;
  line-height: 1.4;
  font-weight: 900;
  color: #1e1845;
  letter-spacing: -.2px
}

.masterclass .material-card__desc {
  font-size: 14px;
  line-height: 1.65;
  color: #4a4370;
  flex: 1
}

.masterclass .material-card__footer {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 0 24px 24px;
  gap: 12px
}

.masterclass .material-card__price-block {
  display: flex;
  flex-direction: column;
  gap: 6px
}

.masterclass .material-card__price {
  font-size: 24px;
  line-height: 1.15;
  font-weight: 900;
  color: #4B3F9B;
  letter-spacing: -.3px
}

.masterclass .material-card__price-terms {
  font-size: 14px;
  line-height: 1.4;
  color: #7a6ab5
}

.masterclass .material-card__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #4B3F9B;
  color: #fff;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 700;
  padding: 12px 24px;
  border-radius: 2px;
  text-decoration: none;
  letter-spacing: .04em;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  transition: background .15s ease-out, box-shadow .15s ease-out;
  flex-shrink: 0
}

.masterclass .material-card__link:hover {
  background: linear-gradient(to right, #4B3F9B, #7a6ab5);
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.masterclass .material-card__link:focus {
  outline: 2px solid #4B3F9B;
  outline-offset: 2px
}

.masterclass .divider-alt {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 0 48px
}

.masterclass .divider-alt__thin {
  height: 1px;
  background: #AA92C9;
  opacity: .35
}

.masterclass .divider-alt__thick {
  height: 2px;
  background: #AA92C9;
  border-radius: 2px;
  opacity: .6
}

.masterclass .approach-area {
  background: #4B3F9B;
  padding: 96px 0;
  position: relative;
  overflow: hidden
}

.masterclass .approach-area__bg-anim {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, #4B3F9B 0%, #6a5ab8 50%, #4B3F9B 100%);
  background-size: 200% 100%;
  animation: colorWash 8s ease-in-out infinite;
  pointer-events: none
}

@keyframes colorWash {
  0% {
    background-position: 0 50%
  }

  50% {
    background-position: 100% 50%
  }

  100% {
    background-position: 0 50%
  }
}

.masterclass .approach-area__inner {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 48px;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: row;
  gap: 96px;
  align-items: flex-start
}

.masterclass .approach-area__left {
  flex: 1 1 40%
}

.masterclass .approach-area__label {
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: .14em;
  color: #AA92C9;
  text-transform: uppercase;
  margin-bottom: 12px
}

.masterclass .approach-area__heading {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #fff;
  letter-spacing: -.5px;
  margin-bottom: 24px
}

.masterclass .approach-area__text {
  font-size: 16px;
  line-height: 1.65;
  color: #d4cce8
}

.masterclass .approach-area__right {
  flex: 1 1 60%;
  display: flex;
  flex-direction: column;
  gap: 24px
}

.masterclass .approach-step {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 24px;
  position: relative
}

.masterclass .approach-step__trail {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
  padding-top: 6px
}

.masterclass .approach-step__dot {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #AA92C9;
  border: 2px solid #fff;
  flex-shrink: 0;
  transition: background .15s ease-out
}

.masterclass .approach-step--active .approach-step__dot {
  background: #fff
}

.masterclass .approach-step__line {
  width: 2px;
  height: 40px;
  background: #aa92c959;
  margin-top: 4px
}

.masterclass .approach-step:last-child .approach-step__line {
  display: none
}

.masterclass .approach-step__body {
  padding-bottom: 12px
}

.masterclass .approach-step__number {
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: .1em;
  color: #AA92C9;
  margin-bottom: 6px;
  text-transform: uppercase
}

.masterclass .approach-step__heading {
  font-size: 18px;
  line-height: 1.4;
  font-weight: 900;
  color: #fff;
  margin-bottom: 6px
}

.masterclass .approach-step__text {
  font-size: 14px;
  line-height: 1.65;
  color: #c4b8e0
}

.masterclass .divider-triple {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 0 48px
}

.masterclass .divider-triple__thin {
  height: 1px;
  background: #4B3F9B;
  opacity: .18
}

.masterclass .divider-triple__thick {
  height: 3px;
  background: linear-gradient(to right, #4B3F9B, #fff);
  border-radius: 2px
}

.masterclass .quote-block {
  max-width: 1140px;
  margin: 0 auto;
  padding: 96px 48px;
  display: flex;
  flex-direction: row;
  gap: 48px;
  align-items: stretch
}

.masterclass .quote-block__notch-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start
}

.masterclass .quote-block__notch {
  width: 6px;
  min-height: 100%;
  background: #4B3F9B;
  border-radius: 2px;
  flex-shrink: 0
}

.masterclass .quote-block__text-side {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 24px
}

.masterclass .quote-block__label {
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: .14em;
  color: #4B3F9B;
  text-transform: uppercase
}

.masterclass .quote-block__quote {
  font-size: 24px;
  line-height: 1.65;
  color: #1e1845;
  font-weight: 400;
  position: relative;
  padding-left: 12px
}

.masterclass .quote-block__quote-accent {
  color: #4B3F9B;
  font-weight: 900
}

.masterclass .quote-block__body {
  font-size: 16px;
  line-height: 1.65;
  color: #4a4370;
  max-width: 680px
}

.masterclass .quote-block__metrics {
  display: flex;
  flex-direction: row;
  gap: 48px;
  flex-wrap: wrap
}

.masterclass .quote-metric {
  display: flex;
  flex-direction: column;
  gap: 6px
}

.masterclass .quote-metric__number {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #4B3F9B;
  letter-spacing: -.5px
}

.masterclass .quote-metric__label {
  font-size: 14px;
  line-height: 1.4;
  color: #7a6ab5;
  letter-spacing: .06em
}

.masterclass .divider-dashed {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 48px;
  display: flex;
  flex-direction: column;
  gap: 6px
}

.masterclass .divider-dashed__line {
  border: none;
  border-top: 2px dashed #AA92C9;
  opacity: .4
}

.masterclass .divider-dashed__thin {
  border: none;
  border-top: 1px solid #4B3F9B;
  opacity: .14
}

.masterclass .faq-area {
  background: #F7F4FA;
  padding: 96px 0
}

.masterclass .faq-area__inner {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 48px;
  display: flex;
  flex-direction: row;
  gap: 96px;
  align-items: flex-start
}

.masterclass .faq-area__left {
  flex: 0 0 280px;
  display: flex;
  flex-direction: column;
  gap: 24px
}

.masterclass .faq-area__label {
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: .14em;
  color: #4B3F9B;
  text-transform: uppercase
}

.masterclass .faq-area__heading {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #1e1845;
  letter-spacing: -.5px
}

.masterclass .faq-area__sub {
  font-size: 16px;
  line-height: 1.65;
  color: #4a4370
}

.masterclass .faq-area__contact {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  line-height: 1.4;
  color: #4B3F9B;
  text-decoration: none;
  font-weight: 700;
  border-bottom: 1px solid #AA92C9;
  padding-bottom: 6px;
  transition: color .15s ease-out, border-color .15s ease-out
}

.masterclass .faq-area__contact:hover {
  color: #AA92C9;
  border-color: #4B3F9B
}

.masterclass .faq-list {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px
}

.masterclass .faq-item {
  background: #fff;
  border-radius: 24px;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  overflow: hidden
}

.masterclass .faq-item__toggle {
  width: 100%;
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 24px;
  gap: 24px;
  text-align: left;
  transition: background .15s ease-out
}

.masterclass .faq-item__toggle:hover {
  background: linear-gradient(to right, #F7F4FA, #fff)
}

.masterclass .faq-item__toggle:focus {
  outline: 2px solid #4B3F9B;
  outline-offset: -2px
}

.masterclass .faq-item__question {
  font-size: 16px;
  line-height: 1.4;
  font-weight: 700;
  color: #1e1845
}

.masterclass .faq-item__icon {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center
}

.masterclass .faq-item__icon-bar {
  width: 12px;
  height: 2px;
  background: #4B3F9B;
  border-radius: 2px;
  transition: transform .18s ease-out
}

.masterclass .faq-item__icon-bar--vertical {
  position: absolute;
  transform: rotate(90deg)
}

.masterclass .faq-item__icon-wrap {
  position: relative;
  width: 12px;
  height: 12px;
  display: flex;
  align-items: center;
  justify-content: center
}

.masterclass .faq-item details[open] .faq-item__icon-bar--vertical {
  transform: rotate(0deg)
}

.masterclass .faq-item__answer {
  padding: 0 24px 24px;
  font-size: 14px;
  line-height: 1.65;
  color: #4a4370
}

.masterclass .faq-item details {
  display: block
}

.masterclass .faq-item details summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 24px;
  gap: 24px;
  transition: background .15s ease-out
}

.masterclass .faq-item details summary::-webkit-details-marker {
  display: none
}

.masterclass .faq-item details summary:hover {
  background: linear-gradient(to right, #F7F4FA, #fff)
}

.masterclass .faq-item details summary:focus {
  outline: 2px solid #4B3F9B;
  outline-offset: -2px
}

.masterclass .faq-item__summary-question {
  font-size: 16px;
  line-height: 1.4;
  font-weight: 700;
  color: #1e1845
}

.masterclass .faq-item__summary-icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center
}

.masterclass .faq-item__summary-icon::before,
.masterclass .faq-item__summary-icon::after {
  content: "";
  position: absolute;
  background: #4B3F9B;
  border-radius: 2px;
  transition: transform .18s ease-out, opacity .18s ease-out
}

.masterclass .faq-item__summary-icon::before {
  width: 12px;
  height: 2px
}

.masterclass .faq-item__summary-icon::after {
  width: 2px;
  height: 12px
}

.masterclass .faq-item details[open] summary .faq-item__summary-icon::after {
  transform: rotate(90deg);
  opacity: 0
}

.masterclass .cycling-words-area {
  max-width: 1140px;
  margin: 0 auto;
  padding: 96px 48px;
  display: flex;
  flex-direction: row;
  gap: 96px;
  align-items: center
}

.masterclass .cycling-words-area__left {
  flex: 1 1 50%;
  display: flex;
  flex-direction: column;
  gap: 24px
}

.masterclass .cycling-words-area__label {
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: .14em;
  color: #4B3F9B;
  text-transform: uppercase
}

.masterclass .cycling-words-area__heading {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #1e1845;
  letter-spacing: -.5px
}

.masterclass .cycling-words-area__body {
  font-size: 16px;
  line-height: 1.65;
  color: #4a4370
}

.masterclass .cycling-words-area__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: none;
  border: 2px solid #4B3F9B;
  color: #4B3F9B;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 700;
  padding: 12px 24px;
  border-radius: 2px;
  text-decoration: none;
  letter-spacing: .04em;
  align-self: flex-start;
  transition: background .15s ease-out, color .15s ease-out, box-shadow .15s ease-out
}

.masterclass .cycling-words-area__link:hover {
  background: linear-gradient(to right, #4B3F9B, #7a6ab5);
  color: #fff;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.masterclass .cycling-words-area__link:focus {
  outline: 2px solid #4B3F9B;
  outline-offset: 2px
}

.masterclass .cycling-words-area__right {
  flex: 1 1 50%;
  background: #F7F4FA;
  border-radius: 24px;
  padding: 48px;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c;
  display: flex;
  flex-direction: column;
  gap: 12px
}

.masterclass .cycling-text {
  font-size: 18px;
  line-height: 1.85;
  color: #1e1845
}

.masterclass .cycling-text__word {
  display: inline;
  padding: 0 2px;
  border-radius: 2px;
  transition: background .12s ease-out, color .12s ease-out
}

.masterclass .cycling-text__word--lit {
  background: #4B3F9B;
  color: #fff
}

@media (max-width: 900px) {
  .masterclass .split-screen {
    flex-direction: column
  }

  .masterclass .split-screen__text-zone {
    padding: 48px 24px
  }

  .masterclass .split-screen__heading {
    font-size: 36px
  }

  .masterclass .split-screen__image-zone {
    min-height: 240px;
    flex: none
  }

  .masterclass .cards-grid {
    grid-template-columns: 1fr
  }

  .masterclass .cards-grid-area {
    padding: 48px 24px
  }

  .masterclass .approach-area__inner {
    flex-direction: column;
    gap: 48px;
    padding: 0 24px
  }

  .masterclass .quote-block {
    flex-direction: column;
    padding: 48px 24px;
    gap: 24px
  }

  .masterclass .quote-block__notch-wrap {
    flex-direction: row
  }

  .masterclass .quote-block__notch {
    width: 100%;
    height: 6px;
    min-height: unset
  }

  .masterclass .faq-area__inner {
    flex-direction: column;
    gap: 48px;
    padding: 0 24px
  }

  .masterclass .faq-area__left {
    flex: none
  }

  .masterclass .cycling-words-area {
    flex-direction: column;
    gap: 48px;
    padding: 48px 24px
  }

  .masterclass .cycling-words-area__right {
    padding: 24px
  }

  .masterclass .divider-heavy,
  .masterclass .divider-alt,
  .masterclass .divider-triple {
    padding: 0 24px
  }

  .masterclass .quote-block__metrics {
    gap: 24px
  }
}

@media (min-width: 901px) and (max-width: 1100px) {
  .masterclass .cards-grid {
    grid-template-columns: repeat(2, 1fr)
  }
}

.blog {
  background: #F7F4FA;
  overflow-x: clip
}

.blog .posts-grid {
  max-width: 1140px;
  margin: 0 auto;
  padding: 96px 24px
}

.blog .posts-grid__label {
  font-size: 14px;
  letter-spacing: .12em;
  color: #4B3F9B;
  text-transform: uppercase;
  margin-bottom: 12px;
  font-weight: 700
}

.blog .posts-grid__heading {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #1e1a3a;
  letter-spacing: -.02em;
  margin-bottom: 48px;
  max-width: 600px
}

.blog .cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px
}

.blog .card {
  background: #fff;
  border-radius: 24px;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow .18s ease-out, transform .15s ease-out
}

.blog .card:hover {
  box-shadow: 1px 9px 48px 0 #4b3f9b1f;
  transform: translateY(-2px)
}

.blog .card__image-wrap {
  position: relative;
  height: 200px;
  overflow: hidden
}

.blog .card__image-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .2s ease-out;
  filter: saturate(0.7) brightness(0.92)
}

.blog .card:hover .card__image-wrap img {
  filter: saturate(1) brightness(1);
  transform: scale(1.03)
}

.blog .card__image-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, #4b3f9b2e 0%, #4b3f9b0a 100%);
  pointer-events: none
}

.blog .card__tag {
  display: inline-block;
  background: #F7F4FA;
  color: #4B3F9B;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 6px 12px;
  border-radius: 2px;
  margin-bottom: 12px
}

.blog .card__body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  flex: 1
}

.blog .card__subtitle {
  font-size: 14px;
  color: #AA92C9;
  font-weight: 600;
  letter-spacing: .04em;
  margin-bottom: 6px
}

.blog .card__title {
  font-size: 18px;
  line-height: 1.4;
  font-weight: 900;
  color: #1e1a3a;
  letter-spacing: -.01em;
  margin-bottom: 12px
}

.blog .card__desc {
  font-size: 16px;
  line-height: 1.65;
  color: #3d3460;
  margin-bottom: 24px;
  flex: 1
}

.blog .card__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap
}

.blog .card__author {
  font-size: 14px;
  color: #6a5fa8;
  font-weight: 600
}

.blog .card__readtime {
  font-size: 14px;
  color: #AA92C9;
  letter-spacing: .04em
}

.blog .card__link {
  display: inline-block;
  background: #4B3F9B;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .06em;
  padding: 12px 24px;
  border-radius: 2px;
  text-decoration: none;
  margin-top: 12px;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  transition: box-shadow .18s ease-out, background .15s ease;
  align-self: flex-start
}

.blog .card__link:hover {
  background: linear-gradient(90deg, #4B3F9B 0%, #AA92C9 100%);
  box-shadow: 1px 7px 14px 0 #4b3f9b38
}

.blog .card__link:focus {
  outline: 2px solid #4B3F9B;
  outline-offset: 2px
}

.blog .about-strip {
  background: #fff;
  border-top: 1px solid #aa92c92e;
  border-bottom: 1px solid #aa92c92e
}

.blog .about-strip__inner {
  max-width: 1140px;
  margin: 0 auto;
  padding: 96px 24px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center
}

.blog .about-strip__image-col {
  position: relative
}

.blog .about-strip__image-frame {
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 1px 9px 48px 0 #4b3f9b1f;
  position: relative
}

.blog .about-strip__image-frame img {
  width: 100%;
  height: 340px;
  object-fit: cover;
  display: block;
  filter: saturate(0.8);
  transition: filter .2s ease-out
}

.blog .about-strip__image-frame:hover img {
  filter: saturate(1)
}

.blog .about-strip__image-tint {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #4b3f9b8c 0%, #4b3f9b14 100%);
  pointer-events: none;
  border-radius: 24px
}

.blog .about-strip__accent-dot {
  position: absolute;
  width: 48px;
  height: 48px;
  border-radius: 24px;
  background: linear-gradient(90deg, #4B3F9B 0%, #AA92C9 100%);
  bottom: -12px;
  right: -12px;
  box-shadow: 1px 7px 14px 0 #4b3f9b38
}

.blog .about-strip__text {
  display: flex;
  flex-direction: column;
  gap: 24px
}

.blog .about-strip__eyebrow {
  font-size: 14px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #AA92C9;
  font-weight: 700
}

.blog .about-strip__heading {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #1e1a3a;
  letter-spacing: -.02em
}

.blog .about-strip__body {
  font-size: 16px;
  line-height: 1.65;
  color: #3d3460
}

.blog .about-strip__body+.blog .about-strip__body {
  margin-top: 12px
}

.blog .about-strip__quote {
  font-size: 18px;
  line-height: 1.4;
  color: #4B3F9B;
  font-weight: 700;
  padding: 24px;
  background: #F7F4FA;
  border-radius: 2px;
  box-shadow: inset 2px 4px 6px 0 #4b3f9b12;
  position: relative
}

.blog .about-strip__quote-mark {
  color: #AA92C9;
  font-size: 36px;
  line-height: 1;
  font-weight: 900;
  display: inline-block;
  margin-right: 6px;
  vertical-align: bottom
}

.blog .about-strip__link {
  display: inline-block;
  background: #F7F4FA;
  color: #4B3F9B;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .06em;
  padding: 12px 24px;
  border-radius: 2px;
  text-decoration: none;
  border: 1.5px solid #4B3F9B;
  align-self: flex-start;
  transition: background .15s ease, box-shadow .18s ease-out;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f
}

.blog .about-strip__link:hover {
  background: linear-gradient(90deg, #4B3F9B 0%, #AA92C9 100%);
  color: #fff;
  box-shadow: 1px 7px 14px 0 #4b3f9b2e
}

.blog .about-strip__link:focus {
  outline: 2px solid #4B3F9B;
  outline-offset: 2px
}

.blog .funnel-band {
  background: linear-gradient(90deg, #4B3F9B 0%, #AA92C9 60%, #F7F4FA 100%);
  padding: 6px 0
}

.blog .metrics-panel {
  background: #1e1a3a;
  position: relative;
  overflow: hidden
}

.blog .metrics-panel__vignette {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 20% 50%, #4b3f9b8c 0%, transparent 65%), radial-gradient(ellipse at 80% 50%, #aa92c938 0%, transparent 60%);
  pointer-events: none;
  animation: vignetteBreath 5s ease-in-out infinite alternate
}

@keyframes vignetteBreath {
  from {
    opacity: .7
  }

  to {
    opacity: 1
  }
}

.blog .metrics-panel__geo {
  position: absolute;
  width: 320px;
  height: 320px;
  border: 1.5px solid #aa92c924;
  border-radius: 24px;
  top: -80px;
  right: -80px;
  animation: slowRotate 22s linear infinite;
  pointer-events: none
}

.blog .metrics-panel__geo--small {
  width: 180px;
  height: 180px;
  bottom: -60px;
  left: -40px;
  top: auto;
  right: auto;
  animation-duration: 34s;
  animation-direction: reverse;
  border-color: #aa92c917
}

@keyframes slowRotate {
  from {
    transform: rotate(0deg)
  }

  to {
    transform: rotate(360deg)
  }
}

.blog .metrics-panel__inner {
  max-width: 1140px;
  margin: 0 auto;
  padding: 96px 24px;
  position: relative;
  z-index: 1
}

.blog .metrics-panel__heading {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #fff;
  letter-spacing: -.02em;
  margin-bottom: 12px
}

.blog .metrics-panel__sub {
  font-size: 16px;
  line-height: 1.65;
  color: #f7f4fab8;
  margin-bottom: 48px;
  max-width: 520px
}

.blog .funnel-chart {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 560px
}

.blog .funnel-step {
  display: flex;
  align-items: center;
  gap: 24px
}

.blog .funnel-step__bar-wrap {
  flex: 1;
  position: relative;
  height: 48px;
  display: flex;
  align-items: center
}

.blog .funnel-step__bar {
  height: 100%;
  border-radius: 2px;
  display: flex;
  align-items: center;
  padding: 0 16px;
  position: relative;
  transition: box-shadow .18s ease-out
}

.blog .funnel-step__bar:hover {
  box-shadow: inset 0 0 0 2px #f7f4fa59 1px 7px 14px 0 #4b3f9b38
}

.blog .funnel-step__bar--a {
  width: 100%;
  background: linear-gradient(90deg, #4B3F9B 0%, #6a5fa8 100%)
}

.blog .funnel-step__bar--b {
  width: 80%;
  background: linear-gradient(90deg, #5c4faa 0%, #7a6bb8 100%)
}

.blog .funnel-step__bar--c {
  width: 58%;
  background: linear-gradient(90deg, #7a6bb8 0%, #AA92C9 100%)
}

.blog .funnel-step__bar--d {
  width: 36%;
  background: linear-gradient(90deg, #AA92C9 0%, #c5aed8 100%)
}

.blog .funnel-step__label {
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  letter-spacing: .04em;
  white-space: nowrap
}

.blog .funnel-step__name {
  font-size: 14px;
  color: #f7f4fab8;
  min-width: 160px;
  letter-spacing: .02em
}

.blog .newsletter-band {
  background: #F7F4FA;
  padding: 96px 24px
}

.blog .newsletter-band__inner {
  max-width: 1140px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start
}

.blog .newsletter-band__text {
  display: flex;
  flex-direction: column;
  gap: 12px
}

.blog .newsletter-band__eyebrow {
  font-size: 14px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #4B3F9B;
  font-weight: 700
}

.blog .newsletter-band__heading {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #1e1a3a;
  letter-spacing: -.02em
}

.blog .newsletter-band__desc {
  font-size: 16px;
  line-height: 1.65;
  color: #3d3460
}

.blog .newsletter-band__trail {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 12px
}

.blog .trail-item {
  display: flex;
  align-items: center;
  gap: 12px
}

.blog .trail-item__dot {
  width: 12px;
  height: 12px;
  border-radius: 24px;
  background: #AA92C9;
  flex-shrink: 0;
  position: relative
}

.blog .trail-item__dot--active {
  background: #4B3F9B;
  box-shadow: 0 0 0 3px #4b3f9b2e
}

.blog .trail-item__text {
  font-size: 16px;
  color: #3d3460;
  line-height: 1.4
}

.blog .newsletter-band__form {
  background: #fff;
  border-radius: 24px;
  padding: 48px;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c;
  display: flex;
  flex-direction: column;
  gap: 24px
}

.blog .form-field {
  display: flex;
  flex-direction: column;
  gap: 6px
}

.blog .form-field__label {
  font-size: 14px;
  font-weight: 700;
  color: #1e1a3a;
  letter-spacing: .04em
}

.blog .form-field__input {
  padding: 12px 16px;
  border: 1.5px solid #aa92c966;
  border-radius: 2px;
  font-size: 16px;
  color: #1e1a3a;
  background: #F7F4FA;
  box-shadow: inset 2px 3px 6px 0 #4b3f9b0d;
  transition: border-color .15s ease, box-shadow .15s ease;
  outline: none
}

.blog .form-field__input::placeholder {
  color: #4b3f9b59;
  transition: opacity .2s ease
}

.blog .form-field__input:focus::placeholder {
  opacity: 0
}

.blog .form-field__input:focus {
  border-color: #4B3F9B;
  box-shadow: inset 2px 3px 6px 0 #4b3f9b12 0 0 0 3px #4b3f9b1a
}

.blog .form-submit {
  background: #4B3F9B;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .06em;
  padding: 16px 24px;
  border: none;
  border-radius: 2px;
  cursor: pointer;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  transition: background .15s ease, box-shadow .18s ease-out
}

.blog .form-submit:hover {
  background: linear-gradient(90deg, #4B3F9B 0%, #AA92C9 100%);
  box-shadow: 1px 7px 14px 0 #4b3f9b38
}

.blog .form-submit:focus {
  outline: 2px solid #4B3F9B;
  outline-offset: 2px
}

.blog .divider-fade {
  height: 6px;
  background: linear-gradient(90deg, #4B3F9B 0%, #f7f4fa00 100%)
}

.blog .topics-row {
  background: #fff;
  padding: 96px 24px
}

.blog .topics-row__inner {
  max-width: 1140px;
  margin: 0 auto
}

.blog .topics-row__heading {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #1e1a3a;
  letter-spacing: -.02em;
  margin-bottom: 48px
}

.blog .topics-columns {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px
}

.blog .topic-card {
  background: #F7F4FA;
  border-radius: 24px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  transition: box-shadow .18s ease-out, background .15s ease;
  position: relative
}

.blog .topic-card:last-child {
  background: linear-gradient(90deg, #4B3F9B 0%, #AA92C9 100%)
}

.blog .topic-card:last-child .topic-card__name {
  color: #fff
}

.blog .topic-card:last-child .topic-card__desc {
  color: #f7f4fad9
}

.blog .topic-card:hover {
  box-shadow: 1px 7px 14px 0 #4b3f9b24
}

.blog .topic-card__icon {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center
}

.blog .topic-card__icon svg {
  width: 28px;
  height: 28px
}

.blog .topic-card__name {
  font-size: 18px;
  font-weight: 900;
  color: #1e1a3a;
  letter-spacing: -.01em;
  line-height: 1.15
}

.blog .topic-card__desc {
  font-size: 14px;
  line-height: 1.65;
  color: #3d3460
}

@media (max-width: 900px) {
  .blog .cards {
    grid-template-columns: 1fr
  }

  .blog .about-strip__inner {
    grid-template-columns: 1fr
  }

  .blog .newsletter-band__inner {
    grid-template-columns: 1fr
  }

  .blog .topics-columns {
    grid-template-columns: repeat(2, 1fr)
  }
}

@media (max-width: 600px) {
  .blog .posts-grid__heading {
    font-size: 24px
  }

  .blog .about-strip__heading {
    font-size: 24px
  }

  .blog .metrics-panel__heading {
    font-size: 24px
  }

  .blog .newsletter-band__heading {
    font-size: 24px
  }

  .blog .topics-row__heading {
    font-size: 24px
  }

  .blog .topics-columns {
    grid-template-columns: 1fr
  }

  .blog .newsletter-band__form {
    padding: 24px
  }
}

.about-author {
  max-width: 100%;
  overflow-x: hidden
}

.about-author .split-screen {
  display: flex;
  flex-direction: row;
  min-height: 0;
  padding: 0
}

.about-author .split-screen__left {
  flex: 1 1 50%;
  background: #4B3F9B;
  padding: 96px 48px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative
}

.about-author .split-screen__right {
  flex: 1 1 50%;
  background: #AA92C9;
  position: relative;
  display: flex;
  align-items: stretch
}

.about-author .split-screen__shapes {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  overflow: hidden
}

.about-author .split-screen__shapes span {
  display: block;
  position: absolute;
  border-radius: 24px;
  opacity: .13;
  background: #F7F4FA
}

.about-author .split-screen__shapes span:nth-child(1) {
  width: 180px;
  height: 180px;
  top: -48px;
  left: -48px;
  transform: rotate(18deg)
}

.about-author .split-screen__shapes span:nth-child(2) {
  width: 120px;
  height: 120px;
  bottom: 48px;
  right: 24px;
  transform: rotate(-12deg)
}

.about-author .split-screen__shapes span:nth-child(3) {
  width: 80px;
  height: 80px;
  top: 48px;
  right: 96px;
  border-radius: 2px;
  opacity: .09
}

.about-author .split-screen__label {
  font-size: 14px;
  line-height: 1.15;
  letter-spacing: .12em;
  color: #AA92C9;
  text-transform: uppercase;
  margin-bottom: 24px;
  font-weight: 600
}

.about-author .split-screen__heading {
  font-size: 70px;
  line-height: 1.15;
  color: #F7F4FA;
  font-weight: 900;
  letter-spacing: -.02em;
  margin: 0 0 24px
}

.about-author .split-screen__desc {
  font-size: 18px;
  line-height: 1.65;
  color: #D8CFF0;
  margin: 0;
  max-width: 420px
}

.about-author .split-screen__border-top {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #AA92C9, #F7F4FA)
}

.about-author .split-screen__border-bottom {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #F7F4FA, #AA92C9)
}

.about-author .split-screen__photo-wrap {
  width: 100%;
  position: relative;
  overflow: hidden
}

.about-author .split-screen__photo-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.85) brightness(0.92) sepia(0.08);
  transition: filter .18s ease-out
}

.about-author .split-screen__photo-wrap:hover img {
  filter: saturate(1.1) brightness(1.0) sepia(0.04)
}

.about-author .split-screen__photo-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #4b3f9b38 0%, #aa92c91a 100%);
  transition: opacity .18s ease-out;
  pointer-events: none
}

.about-author .split-screen__photo-wrap:hover .split-screen__photo-overlay {
  opacity: 0
}

.about-author .split-screen__blur-layer {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 96px;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  background: linear-gradient(0deg, #aa92c959 0%, transparent 100%);
  pointer-events: none
}

.about-author .story-band {
  background: #F7F4FA;
  padding: 96px 24px;
  position: relative
}

.about-author .story-band__inner {
  max-width: 1140px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 2fr 2fr 1fr;
  gap: 48px;
  align-items: start
}

.about-author .story-band__anchor {
  grid-column: 1 / 2;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  padding-top: 6px
}

.about-author .story-band__number {
  font-size: 70px;
  line-height: 1.15;
  font-weight: 900;
  color: #4B3F9B;
  letter-spacing: -.03em;
  display: block
}

.about-author .story-band__number-label {
  font-size: 14px;
  line-height: 1.4;
  color: #AA92C9;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-weight: 600;
  text-align: right
}

.about-author .story-band__body {
  grid-column: 2 / 4
}

.about-author .story-band__heading {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #2A2050;
  letter-spacing: -.02em;
  margin: 0 0 24px
}

.about-author .story-band__text {
  font-size: 16px;
  line-height: 1.65;
  color: #3A3060;
  margin: 0 0 12px
}

.about-author .story-band__quote {
  margin: 24px 0;
  padding: 24px;
  background: #EDE8F5;
  border-radius: 2px;
  box-shadow: inset 0 2px 6px 0 #4b3f9b14;
  position: relative
}

.about-author .story-band__quote-mark {
  font-size: 36px;
  line-height: 1.15;
  color: #4B3F9B;
  font-weight: 900;
  display: inline;
  margin-right: 6px
}

.about-author .story-band__quote-mark--close {
  margin-right: 0;
  margin-left: 6px
}

.about-author .story-band__quote-text {
  font-size: 18px;
  line-height: 1.65;
  color: #2A2050;
  font-style: italic;
  display: inline
}

.about-author .story-band__side {
  grid-column: 4 / 5;
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding-top: 6px
}

.about-author .story-band__tag {
  font-size: 14px;
  line-height: 1.4;
  color: #4B3F9B;
  letter-spacing: .06em;
  font-weight: 700;
  text-transform: uppercase;
  background: #EDE8F5;
  border-radius: 2px;
  padding: 6px 12px;
  display: block
}

.about-author .story-band__divider {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 48px 0 0
}

.about-author .story-band__divider-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #4B3F9B;
  display: block
}

.about-author .story-band__divider-line {
  flex: 0 0 80px;
  height: 1px;
  background: #AA92C9;
  display: block
}

.about-author .mesh-band {
  padding: 96px 24px;
  position: relative;
  background: linear-gradient(135deg, #4B3F9B 0%, #6B5BB5 30%, #AA92C9 65%, #D4C5E8 100%);
  animation: contrast-breathe 6s ease-in-out infinite
}

@keyframes contrast-breathe {

  0%,
  100% {
    filter: contrast(1)
  }

  50% {
    filter: contrast(1.12)
  }
}

.about-author .mesh-band__inner {
  max-width: 1140px;
  margin: 0 auto
}

.about-author .mesh-band__heading {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #F7F4FA;
  letter-spacing: -.02em;
  margin: 0 0 48px;
  text-align: center
}

.about-author .mesh-band__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px
}

.about-author .mesh-band__card {
  background: #f7f4fa1f;
  border-radius: 24px;
  padding: 48px 24px;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c;
  display: flex;
  flex-direction: column;
  gap: 12px;
  border-top: 4px solid #f7f4fa59;
  border-bottom: 4px solid #f7f4fa1a;
  transition: background .15s ease-out, box-shadow .2s ease;
  cursor: default
}

.about-author .mesh-band__card:hover {
  background: #f7f4fa38;
  box-shadow: 1px 9px 48px 0 #4b3f9b1f
}

.about-author .mesh-band__card-label {
  font-size: 14px;
  line-height: 1.15;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #D4C5E8;
  font-weight: 700
}

.about-author .mesh-band__card-heading {
  font-size: 24px;
  line-height: 1.4;
  font-weight: 900;
  color: #F7F4FA;
  letter-spacing: -.01em;
  margin: 0
}

.about-author .mesh-band__card-text {
  font-size: 16px;
  line-height: 1.65;
  color: #E0D8F2;
  margin: 0
}

.about-author .mesh-band__card-icon {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 6px
}

.about-author .mesh-band__card-icon svg {
  width: 32px;
  height: 32px
}

.about-author .photos-band {
  background: #2A2050;
  padding: 96px 24px;
  position: relative
}

.about-author .photos-band__border-top {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #4B3F9B, #AA92C9, #F7F4FA)
}

.about-author .photos-band__border-bottom {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #F7F4FA, #AA92C9, #4B3F9B)
}

.about-author .photos-band__inner {
  max-width: 1140px;
  margin: 0 auto
}

.about-author .photos-band__top {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 48px;
  gap: 48px
}

.about-author .photos-band__heading {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #F7F4FA;
  letter-spacing: -.02em;
  margin: 0;
  max-width: 480px
}

.about-author .photos-band__subtext {
  font-size: 16px;
  line-height: 1.65;
  color: #AA92C9;
  max-width: 340px;
  margin: 0
}

.about-author .photos-band__grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 24px
}

.about-author .photos-band__item {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.about-author .photos-band__item--wide {
  grid-column: 1 / 3
}

.about-author .photos-band__item img {
  width: 100%;
  height: 280px;
  object-fit: cover;
  display: block;
  filter: saturate(0.8) brightness(0.88) sepia(0.10);
  transition: filter .18s ease-out
}

.about-author .photos-band__item--wide img {
  height: 320px
}

.about-author .photos-band__item:hover img {
  filter: saturate(1.05) brightness(1.0) sepia(0.04)
}

.about-author .photos-band__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 40%, #2a2050b3 100%);
  pointer-events: none;
  transition: opacity .18s ease-out
}

.about-author .photos-band__item:hover .photos-band__overlay {
  opacity: .5
}

.about-author .photos-band__caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 12px 24px;
  font-size: 14px;
  line-height: 1.4;
  color: #F7F4FA;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase
}

.about-author .skills-band {
  background: #F7F4FA;
  padding: 96px 24px;
  position: relative
}

.about-author .skills-band__inner {
  max-width: 1140px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 96px;
  align-items: start
}

.about-author .skills-band__left {
  display: flex;
  flex-direction: column;
  gap: 24px
}

.about-author .skills-band__heading {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #2A2050;
  letter-spacing: -.02em;
  margin: 0
}

.about-author .skills-band__text {
  font-size: 16px;
  line-height: 1.65;
  color: #3A3060;
  margin: 0
}

.about-author .skills-band__trail {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: 12px
}

.about-author .skills-band__trail-item {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 24px;
  position: relative
}

.about-author .skills-band__trail-item:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 11px;
  top: 24px;
  bottom: -12px;
  width: 2px;
  background: #AA92C9
}

.about-author .skills-band__dot-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 6px;
  flex-shrink: 0
}

.about-author .skills-band__dot {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #4B3F9B;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  flex-shrink: 0;
  display: block
}

.about-author .skills-band__trail-item--active .skills-band__dot {
  background: #AA92C9;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.about-author .skills-band__trail-body {
  padding-bottom: 48px
}

.about-author .skills-band__trail-label {
  font-size: 14px;
  line-height: 1.15;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #4B3F9B;
  font-weight: 700;
  margin-bottom: 6px
}

.about-author .skills-band__trail-text {
  font-size: 16px;
  line-height: 1.65;
  color: #3A3060;
  margin: 0
}

.about-author .skills-band__right {
  display: flex;
  flex-direction: column;
  gap: 24px
}

.about-author .skills-band__photo-wrap {
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 1px 9px 48px 0 #4b3f9b1f;
  position: relative
}

.about-author .skills-band__photo-wrap img {
  width: 100%;
  height: 360px;
  object-fit: cover;
  display: block;
  filter: saturate(0.85) brightness(0.92) sepia(0.06);
  transition: filter .2s ease
}

.about-author .skills-band__photo-wrap:hover img {
  filter: saturate(1.1) brightness(1.0) sepia(0.02)
}

.about-author .skills-band__photo-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #4b3f9b2e 0%, transparent 100%);
  pointer-events: none;
  transition: opacity .18s ease-out
}

.about-author .skills-band__photo-wrap:hover .skills-band__photo-overlay {
  opacity: 0
}

.about-author .skills-band__stat-row {
  display: flex;
  flex-direction: row;
  gap: 24px
}

.about-author .skills-band__stat {
  flex: 1;
  background: #EDE8F5;
  border-radius: 2px;
  padding: 24px;
  box-shadow: inset 0 3px 6px 0 #4b3f9b12;
  display: flex;
  flex-direction: column;
  gap: 6px;
  border-top: 4px solid #4B3F9B;
  border-bottom: 4px solid transparent;
  transition: background .15s ease-out
}

.about-author .skills-band__stat:hover {
  background: linear-gradient(135deg, #EDE8F5 0%, #D4C5E8 100%)
}

.about-author .skills-band__stat-value {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #4B3F9B;
  letter-spacing: -.02em
}

.about-author .skills-band__stat-label {
  font-size: 14px;
  line-height: 1.4;
  color: #5A4A80;
  font-weight: 600;
  letter-spacing: .04em
}

.about-author .skills-band__divider {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  margin-top: 48px
}

.about-author .skills-band__divider-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #4B3F9B;
  display: block
}

.about-author .skills-band__divider-line {
  flex: 0 0 80px;
  height: 1px;
  background: #AA92C9;
  display: block
}

.about-author .skills-band__divider-dot--end {
  background: #AA92C9
}

@media (max-width: 900px) {
  .about-author .split-screen {
    flex-direction: column
  }

  .about-author .split-screen__left {
    padding: 48px 24px
  }

  .about-author .split-screen__heading {
    font-size: 36px
  }

  .about-author .split-screen__right {
    min-height: 320px
  }

  .about-author .story-band__inner {
    grid-template-columns: 1fr;
    gap: 24px
  }

  .about-author .story-band__anchor {
    grid-column: 1;
    align-items: flex-start
  }

  .about-author .story-band__body {
    grid-column: 1
  }

  .about-author .story-band__side {
    grid-column: 1;
    flex-direction: row;
    flex-wrap: wrap
  }

  .about-author .mesh-band__grid {
    grid-template-columns: 1fr
  }

  .about-author .photos-band__grid {
    grid-template-columns: 1fr
  }

  .about-author .photos-band__item--wide {
    grid-column: 1
  }

  .about-author .photos-band__top {
    flex-direction: column;
    align-items: flex-start;
    gap: 24px
  }

  .about-author .skills-band__inner {
    grid-template-columns: 1fr;
    gap: 48px
  }
}

@media (max-width: 600px) {
  .about-author .split-screen__heading {
    font-size: 36px
  }

  .about-author .skills-band__stat-row {
    flex-direction: column
  }

  .about-author .mesh-band {
    padding: 48px 24px
  }

  .about-author .story-band {
    padding: 48px 24px
  }

  .about-author .photos-band {
    padding: 48px 24px
  }

  .about-author .skills-band {
    padding: 48px 24px
  }
}

.prime {
  max-width: 100%;
  overflow-x: hidden
}

.prime .page-boundary {
  max-width: 1140px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px
}

.prime .strokes-decoration {
  position: absolute;
  display: flex;
  flex-direction: column;
  gap: 6px;
  pointer-events: none
}

.prime .strokes-decoration span {
  display: block;
  height: 2px;
  background: #4B3F9B;
  opacity: .18;
  border-radius: 2px
}

.prime .gradient-divider {
  height: 2px;
  background: linear-gradient(to right, #4B3F9B, #F7F4FA);
  border: none;
  margin: 0
}

.prime .gradient-divider--light {
  background: linear-gradient(to right, #AA92C9, #F7F4FA)
}

.prime .tag-label {
  display: inline-block;
  font-size: 14px;
  line-height: 1.15;
  letter-spacing: .06em;
  color: #4B3F9B;
  background: #F7F4FA;
  border: 1px solid #AA92C9;
  border-radius: 2px;
  padding: 6px 12px;
  font-weight: 600;
  text-transform: uppercase
}

.prime .section-label {
  font-size: 14px;
  line-height: 1.15;
  letter-spacing: .1em;
  color: #AA92C9;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 12px
}

.prime .banner {
  position: relative;
  background: linear-gradient(105deg, #4B3F9B 0%, #4B3F9B 45%, #F7F4FA 45%, #F7F4FA 100%);
  padding: 48px 0;
  overflow: hidden
}

.prime .banner .strokes-decoration {
  top: 24px;
  right: 48px
}

.prime .banner__row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 48px
}

.prime .banner__text {
  flex: 0 0 42%;
  min-width: 0
}

.prime .banner__accent-bar {
  width: 48px;
  height: 3px;
  background: #AA92C9;
  border-radius: 2px;
  margin-bottom: 24px
}

.prime .banner__heading {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  letter-spacing: -.02em;
  color: #fff;
  margin: 0 0 12px
}

.prime .banner__heading em {
  font-style: normal;
  color: #AA92C9
}

.prime .banner__sub {
  font-size: 16px;
  line-height: 1.65;
  color: #ffffffd1;
  margin: 0 0 24px
}

.prime .banner__cta {
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  color: #4B3F9B;
  background: #fff;
  border: none;
  border-radius: 2px;
  padding: 12px 24px;
  text-decoration: none;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  transition: box-shadow .15s ease-out, background .12s ease-out
}

.prime .banner__cta:hover {
  box-shadow: 1px 7px 14px 0 #4b3f9b1c;
  background: #F7F4FA
}

.prime .banner__image-col {
  flex: 1 1 0;
  min-width: 0;
  position: relative
}

.prime .banner__image-wrap {
  position: relative;
  border-radius: 2px;
  overflow: hidden;
  height: 260px
}

.prime .banner__image-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: sepia(0.22) saturate(1.1) brightness(0.95);
  transition: filter .18s ease-out
}

.prime .banner__image-wrap:hover img {
  filter: sepia(0) saturate(1) brightness(1)
}

.prime .banner__image-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, #4b3f9b38, transparent);
  pointer-events: none;
  transition: opacity .18s ease-out
}

.prime .banner__image-wrap:hover .banner__image-overlay {
  opacity: 0
}

.prime .stats-bar {
  background: #4B3F9B;
  padding: 24px 0
}

.prime .stats-bar__row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap
}

.prime .stats-bar__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  flex: 1 1 120px
}

.prime .stats-bar__number {
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
  color: #fff;
  letter-spacing: -.02em
}

.prime .stats-bar__desc {
  font-size: 14px;
  line-height: 1.4;
  color: #ffffffb3;
  letter-spacing: .04em;
  text-align: center
}

.prime .stats-bar__sep {
  width: 1px;
  height: 40px;
  background: #ffffff2e;
  flex: 0 0 1px
}

.prime .about-strip {
  background: #F7F4FA;
  padding: 48px 0;
  position: relative
}

.prime .about-strip__row {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 48px
}

.prime .about-strip__quote-col {
  flex: 0 0 52%;
  min-width: 0
}

.prime .about-strip__quote {
  font-size: 24px;
  line-height: 1.4;
  font-weight: 800;
  color: #2a2060;
  letter-spacing: -.01em;
  margin: 0 0 24px;
  position: relative;
  padding-left: 24px
}

.prime .about-strip__quote::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  width: 4px;
  height: calc(100% - 8px);
  background: linear-gradient(to bottom, #4B3F9B, #AA92C9);
  border-radius: 2px
}

.prime .about-strip__accent-open {
  color: #4B3F9B;
  font-size: 36px;
  line-height: 1;
  vertical-align: -.12em;
  margin-right: 4px
}

.prime .about-strip__accent-close {
  color: #4B3F9B;
  font-size: 36px;
  line-height: 1;
  vertical-align: -.12em;
  margin-left: 4px
}

.prime .about-strip__body {
  font-size: 16px;
  line-height: 1.65;
  color: #3a3060;
  margin: 0
}

.prime .about-strip__meta-col {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding-top: 6px
}

.prime .about-strip__fact {
  border-top: 2px solid #AA92C9;
  padding-top: 12px
}

.prime .about-strip__fact-label {
  font-size: 14px;
  line-height: 1.15;
  letter-spacing: .08em;
  color: #AA92C9;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 6px
}

.prime .about-strip__fact-value {
  font-size: 16px;
  line-height: 1.4;
  color: #2a2060;
  font-weight: 600
}

.prime .posts-area {
  padding: 48px 0;
  background: #fff
}

.prime .posts-area__heading {
  font-size: 24px;
  line-height: 1.15;
  font-weight: 900;
  letter-spacing: -.01em;
  color: #2a2060;
  margin: 0 0 24px
}

.prime .posts-area__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px
}

.prime .post-card {
  background: #fff;
  border-radius: 24px;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border-top: 3px solid #4B3F9B;
  transition: box-shadow .15s ease-out;
  text-decoration: none
}

.prime .post-card:hover {
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.prime .post-card__image-wrap {
  position: relative;
  height: 180px;
  overflow: hidden
}

.prime .post-card__image-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: filter .18s ease-out;
  filter: saturate(0.85) brightness(0.95)
}

.prime .post-card:hover .post-card__image-wrap img {
  filter: saturate(1) brightness(1)
}

.prime .post-card__image-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, #4b3f9b2e, transparent);
  pointer-events: none;
  transition: opacity .15s ease-out
}

.prime .post-card:hover .post-card__image-overlay {
  opacity: 0
}

.prime .post-card__body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1 1 auto
}

.prime .post-card__tag {
  display: inline-block;
  font-size: 14px;
  line-height: 1.15;
  letter-spacing: .07em;
  font-weight: 700;
  color: #4B3F9B;
  text-transform: uppercase
}

.prime .post-card__title {
  font-size: 18px;
  line-height: 1.4;
  font-weight: 800;
  color: #2a2060;
  margin: 0
}

.prime .post-card__subtitle {
  font-size: 14px;
  line-height: 1.65;
  color: #6a5fa0;
  margin: 0
}

.prime .post-card__desc {
  font-size: 14px;
  line-height: 1.65;
  color: #555080;
  margin: 0
}

.prime .post-card__foot {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid #F7F4FA
}

.prime .post-card__author {
  font-size: 14px;
  line-height: 1.4;
  color: #8878c0;
  font-weight: 600
}

.prime .post-card__readtime {
  font-size: 14px;
  line-height: 1.4;
  color: #AA92C9
}

.prime .picks-strip {
  padding: 48px 0;
  background: #F7F4FA;
  position: relative
}

.prime .picks-strip__texture {
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(0deg, transparent, transparent 28px, #4b3f9b06 28px, #4b3f9b06 29px);
  pointer-events: none
}

.prime .picks-strip__heading {
  font-size: 24px;
  line-height: 1.15;
  font-weight: 900;
  color: #2a2060;
  letter-spacing: -.01em;
  margin: 0 0 24px
}

.prime .picks-strip__list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  list-style: none;
  padding: 0;
  margin: 0;
  position: relative;
  padding-left: 24px
}

.prime .picks-strip__list::before {
  content: "";
  position: absolute;
  left: 8px;
  top: 10px;
  bottom: 10px;
  width: 2px;
  background: linear-gradient(to bottom, #4B3F9B, #AA92C9);
  border-radius: 2px
}

.prime .pick-item {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 24px;
  background: #fff;
  border-radius: 2px;
  padding: 24px;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  position: relative;
  transition: box-shadow .12s ease-out
}

.prime .pick-item::before {
  content: "";
  position: absolute;
  left: -20px;
  top: 50%;
  transform: translateY(-50%);
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #4B3F9B;
  border: 2px solid #F7F4FA;
  box-shadow: 0 0 0 2px #4B3F9B
}

.prime .pick-item:hover {
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.prime .pick-item__number {
  font-size: 36px;
  line-height: 1;
  font-weight: 900;
  color: #F7F4FA;
  flex: 0 0 auto;
  user-select: none;
  letter-spacing: -.03em
}

.prime .pick-item__text {
  flex: 1 1 0;
  min-width: 0
}

.prime .pick-item__label {
  font-size: 14px;
  line-height: 1.15;
  letter-spacing: .07em;
  font-weight: 700;
  color: #AA92C9;
  text-transform: uppercase;
  margin-bottom: 6px
}

.prime .pick-item__title {
  font-size: 18px;
  line-height: 1.4;
  font-weight: 800;
  color: #2a2060;
  margin: 0 0 6px
}

.prime .pick-item__reason {
  font-size: 14px;
  line-height: 1.65;
  color: #6a5fa0;
  margin: 0
}

.prime .pick-item__link {
  display: inline-block;
  margin-top: 12px;
  font-size: 14px;
  font-weight: 700;
  color: #4B3F9B;
  text-decoration: none;
  letter-spacing: .04em;
  border-bottom: 1px solid #AA92C9;
  padding-bottom: 2px;
  transition: color .12s ease-out, border-color .12s ease-out
}

.prime .pick-item__link:hover {
  color: #AA92C9;
  border-color: #4B3F9B
}

.prime .topic-map {
  padding: 48px 0;
  background: #fff
}

.prime .topic-map__row {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 48px
}

.prime .topic-map__left {
  flex: 0 0 38%;
  min-width: 0
}

.prime .topic-map__heading {
  font-size: 24px;
  line-height: 1.15;
  font-weight: 900;
  color: #2a2060;
  letter-spacing: -.01em;
  margin: 0 0 12px
}

.prime .topic-map__desc {
  font-size: 16px;
  line-height: 1.65;
  color: #555080;
  margin: 0 0 24px
}

.prime .topic-map__image-wrap {
  position: relative;
  height: 200px;
  border-radius: 2px;
  overflow: hidden
}

.prime .topic-map__image-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.8) brightness(0.95);
  transition: filter .18s ease-out
}

.prime .topic-map__image-wrap:hover img {
  filter: saturate(1) brightness(1)
}

.prime .topic-map__image-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, #4b3f9b26, transparent);
  pointer-events: none;
  transition: opacity .18s ease-out
}

.prime .topic-map__image-wrap:hover .topic-map__image-overlay {
  opacity: 0
}

.prime .topic-map__right {
  flex: 1 1 0;
  min-width: 0
}

.prime .topic-map__tags {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 12px
}

.prime .topic-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 12px 24px;
  background: #F7F4FA;
  border: 1px solid #AA92C9;
  border-radius: 2px;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 600;
  color: #4B3F9B;
  text-decoration: none;
  letter-spacing: .04em;
  transition: background .12s ease-out, box-shadow .12s ease-out;
  cursor: default
}

.prime .topic-tag--active {
  background: #4B3F9B;
  color: #fff;
  border-color: #4B3F9B
}

.prime .topic-tag:hover {
  background: linear-gradient(to right, #4B3F9B, #AA92C9);
  color: #fff;
  border-color: transparent;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.prime .topic-tag__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  opacity: .6;
  flex-shrink: 0
}

.prime .adjacent-area {
  padding: 48px 0;
  background: #2a2060;
  position: relative
}

.prime .adjacent-area__heading {
  font-size: 24px;
  line-height: 1.15;
  font-weight: 900;
  color: #fff;
  letter-spacing: -.01em;
  margin: 0 0 24px
}

.prime .adjacent-area__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px
}

.prime .adjacent-card {
  background: #ffffff0f;
  border-radius: 24px;
  padding: 24px;
  border-top: 3px solid #AA92C9;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: background .15s ease-out, box-shadow .15s ease-out
}

.prime .adjacent-card:hover {
  background: #ffffff1a;
  box-shadow: 1px 9px 48px 0 #4b3f9b1f
}

.prime .adjacent-card__icon {
  width: 36px;
  height: 36px;
  flex-shrink: 0
}

.prime .adjacent-card__name {
  font-size: 18px;
  line-height: 1.4;
  font-weight: 800;
  color: #fff;
  margin: 0
}

.prime .adjacent-card__desc {
  font-size: 14px;
  line-height: 1.65;
  color: #ffffffa6;
  margin: 0;
  flex: 1 1 auto
}

.prime .adjacent-card__link {
  font-size: 14px;
  font-weight: 700;
  color: #AA92C9;
  text-decoration: none;
  letter-spacing: .04em;
  transition: color .12s ease-out;
  align-self: flex-start
}

.prime .adjacent-card__link:hover {
  color: #fff
}

.prime .next-step {
  padding: 48px 0;
  background: #F7F4FA
}

.prime .next-step__row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 48px
}

.prime .next-step__image-col {
  flex: 0 0 44%;
  min-width: 0
}

.prime .next-step__image-wrap {
  position: relative;
  height: 260px;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 1px 9px 48px 0 #4b3f9b1f
}

.prime .next-step__image-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.85);
  transition: filter .18s ease-out
}

.prime .next-step__image-wrap:hover img {
  filter: saturate(1)
}

.prime .next-step__image-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, #4b3f9b33, transparent);
  pointer-events: none;
  transition: opacity .18s ease-out
}

.prime .next-step__image-wrap:hover .next-step__image-overlay {
  opacity: 0
}

.prime .next-step__text-col {
  flex: 1 1 0;
  min-width: 0
}

.prime .next-step__heading {
  font-size: 24px;
  line-height: 1.15;
  font-weight: 900;
  color: #2a2060;
  letter-spacing: -.01em;
  margin: 0 0 12px
}

.prime .next-step__body {
  font-size: 16px;
  line-height: 1.65;
  color: #555080;
  margin: 0 0 24px
}

.prime .next-step__actions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 12px
}

.prime .btn-primary {
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  background: #4B3F9B;
  border: none;
  border-radius: 2px;
  padding: 12px 24px;
  text-decoration: none;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  cursor: pointer;
  transition: box-shadow .15s ease-out, background .12s ease-out
}

.prime .btn-primary:hover {
  background: linear-gradient(to right, #4B3F9B, #6a5fa0);
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.prime .btn-secondary {
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  color: #4B3F9B;
  background: #fff;
  border: 1px solid #AA92C9;
  border-radius: 2px;
  padding: 12px 24px;
  text-decoration: none;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  cursor: pointer;
  transition: box-shadow .15s ease-out, border-color .12s ease-out
}

.prime .btn-secondary:hover {
  box-shadow: 1px 7px 14px 0 #4b3f9b1c;
  border-color: #4B3F9B
}

@keyframes card-flip-in {
  0% {
    transform: rotateY(90deg);
    opacity: 0
  }

  100% {
    transform: rotateY(0deg);
    opacity: 1
  }
}

.prime .posts-area__grid .post-card:nth-child(1) {
  animation: card-flip-in .2s ease-out both;
  animation-delay: .05s
}

.prime .posts-area__grid .post-card:nth-child(2) {
  animation: card-flip-in .2s ease-out both;
  animation-delay: .12s
}

.prime .posts-area__grid .post-card:nth-child(3) {
  animation: card-flip-in .2s ease-out both;
  animation-delay: .19s
}

.prime .posts-area__grid .post-card:nth-child(4) {
  animation: card-flip-in .2s ease-out both;
  animation-delay: .26s
}

@media (max-width: 900px) {
  .prime .banner__row {
    flex-direction: column;
    gap: 24px
  }

  .prime .banner {
    background: linear-gradient(170deg, #4B3F9B 0%, #4B3F9B 50%, #F7F4FA 50%, #F7F4FA 100%)
  }

  .prime .banner__text {
    flex: none;
    width: 100%
  }

  .prime .about-strip__row {
    flex-direction: column;
    gap: 24px
  }

  .prime .about-strip__quote-col {
    flex: none;
    width: 100%
  }

  .prime .posts-area__grid {
    grid-template-columns: 1fr
  }

  .prime .topic-map__row {
    flex-direction: column;
    gap: 24px
  }

  .prime .topic-map__left {
    flex: none;
    width: 100%
  }

  .prime .adjacent-area__grid {
    grid-template-columns: 1fr
  }

  .prime .next-step__row {
    flex-direction: column;
    gap: 24px
  }

  .prime .next-step__image-col {
    flex: none;
    width: 100%
  }

  .prime .stats-bar__sep {
    display: none
  }
}

@media (max-width: 600px) {
  .prime .banner__heading {
    font-size: 24px
  }

  .prime .stats-bar__row {
    flex-direction: column;
    gap: 24px
  }

  .prime .picks-strip__list {
    padding-left: 12px
  }

  .prime .pick-item {
    flex-direction: column;
    gap: 12px
  }

  .prime .pick-item__number {
    font-size: 24px
  }
}

.success-page {
  min-height: 60vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 96px 24px;
  background-color: #F7F4FA
}

.success-page .confirmation-card {
  background: #fff;
  border-radius: 24px;
  padding: 48px;
  max-width: 560px;
  width: 100%;
  box-shadow: 1px 9px 48px 0 #4b3f9b1f;
  text-align: center
}

.success-page .confirmation-card .icon-wrapper {
  width: 72px;
  height: 72px;
  border-radius: 24px;
  background: linear-gradient(to right, #4B3F9B, #AA92C9);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  margin: 0 auto 24px
}

.success-page .confirmation-card .icon-wrapper svg {
  display: block
}

.success-page .confirmation-card .confirmation-heading {
  font-size: 36px;
  font-weight: 900;
  line-height: 1.15;
  letter-spacing: -.02em;
  color: #4B3F9B;
  margin: 0 0 12px
}

.success-page .confirmation-card .confirmation-subtext {
  font-size: 16px;
  line-height: 1.65;
  color: #3a3150;
  margin: 0 0 24px
}

.success-page .confirmation-card .confirmation-detail {
  font-size: 14px;
  line-height: 1.65;
  color: #6b5ea8;
  background: #F7F4FA;
  border-radius: 2px;
  padding: 12px 24px;
  margin: 0 0 48px;
  box-shadow: inset 1px 3px 6px 0 #4b3f9b0f
}

.success-page .confirmation-card .confirmation-detail strong {
  color: #4B3F9B;
  font-weight: 700
}

.success-page .confirmation-card .action-group {
  display: flex;
  flex-direction: row;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap
}

.success-page .confirmation-card .button-primary {
  display: inline-block;
  padding: 12px 24px;
  background: #4B3F9B;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .01em;
  border-radius: 2px;
  text-decoration: none;
  border: 2px solid #4B3F9B;
  box-shadow: 1px 2px 2px 0 #4b3f9b0f;
  transition: box-shadow .15s ease-out, background .15s ease-out
}

.success-page .confirmation-card .button-primary:hover {
  background: linear-gradient(to right, #4B3F9B, #6b5ea8);
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.success-page .confirmation-card .button-primary:focus {
  outline: 3px solid #AA92C9;
  outline-offset: 3px
}

.success-page .confirmation-card .button-secondary {
  display: inline-block;
  padding: 12px 24px;
  background: #fff;
  color: #4B3F9B;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .01em;
  border-radius: 2px;
  text-decoration: none;
  border: 2px solid #AA92C9;
  box-shadow: 1px 2px 2px 0 #aa92c90f;
  transition: box-shadow .12s ease, border-color .12s ease
}

.success-page .confirmation-card .button-secondary:hover {
  border-color: #4B3F9B;
  box-shadow: 1px 7px 14px 0 #4b3f9b1c
}

.success-page .confirmation-card .button-secondary:focus {
  outline: 3px solid #AA92C9;
  outline-offset: 3px
}

.success-page .confirmation-card .divider-line {
  width: 48px;
  height: 2px;
  background: linear-gradient(to right, #4B3F9B, #AA92C9);
  border-radius: 2px;
  margin: 0 auto 24px
}

@media (max-width: 600px) {
  .success-page {
    padding: 48px 12px
  }

  .success-page .confirmation-card {
    padding: 24px
  }

  .success-page .confirmation-card .confirmation-heading {
    font-size: 24px
  }

  .success-page .confirmation-card .action-group {
    flex-direction: column;
    align-items: stretch
  }

  .success-page .confirmation-card .button-primary,
  .success-page .confirmation-card .button-secondary {
    text-align: center
  }
}