@import "https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,400;1,400;0,500;1,500;0,700;1,700&display=swap";
@import "https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,400;1,400;0,500;1,500;0,700;1,700&display=swap";

html,
body {
  margin: 0;
  padding: 0
}

body {
  margin: 0;
  min-height: 100dvh;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  font-family: 'Figtree', -apple-system, BlinkMacSystemFont, sans-serif;
  background: linear-gradient(165deg, #0a1628 0%, #0d1117 35%, #111820 100%);
  color: #e8edf4;
  font-size: 16px;
  line-height: 1.7
}

.utility_strip {
  background: linear-gradient(90deg, #0d1a2d 0%, #0f1b29 100%);
  border-bottom: 1px solid #15886626;
  padding: 8px 0
}

.utility_container {
  max-width: 1024px;
  margin: 0 auto;
  padding: 0 32px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 32px
}

.contact_quick {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #c4d0dd;
  font-size: 15px;
  text-decoration: none;
  transition: color .15s ease-out;
  font-family: 'JetBrains Mono', monospace
}

.contact_quick:hover {
  color: #158866
}

.contact_quick:focus {
  outline: 2px solid #158866;
  outline-offset: 4px;
  background: #0d1117;
  color: #e8edf4
}

.contact_quick .icon_mark {
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center
}

.contact_quick .icon_mark svg {
  width: 100%;
  height: 100%;
  fill: currentColor
}

.primary_band {
  background: linear-gradient(180deg, #0f1d2e 0%, #0d1620 100%);
  border-bottom: 2px solid #15886633;
  box-shadow: 2px 7px 14px 0 #15886617;
  padding: 20px 0
}

.primary_container {
  max-width: 1024px;
  margin: 0 auto;
  padding: 0 32px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 64px;
  align-items: center
}

.brand_cluster {
  display: flex;
  flex-direction: column;
  gap: 8px
}

.logo_frame {
  width: 60px;
  height: 60px;
  padding: 8px;
  background: #ffffff08;
  border: 1px solid #ffffff1f;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 2px 2px 4px 0 #15886614 inset 0 1px 0 #ffffff0d;
  transition: border-color .12s ease-out, box-shadow .12s ease-out
}

.logo_frame:hover {
  border-color: #15886666;
  box-shadow: 2px 7px 14px 0 #15886617
}

.logo_frame img {
  width: 100%;
  height: 100%;
  object-fit: contain
}

.company_label {
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  line-height: 1.15;
  letter-spacing: .02em
}

.tagline_text {
  font-size: 15px;
  color: #9ba8b8;
  line-height: 1.15;
  font-weight: 400
}

.nav_spread {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap
}

.nav_link {
  padding: 12px 20px;
  font-size: 16px;
  font-weight: 500;
  color: #d4dce6;
  text-decoration: none;
  border-radius: 5px;
  background: transparent;
  position: relative;
  overflow: hidden;
  transition: color .18s ease-out;
  display: inline-block
}

.nav_link::before {
  content: '';
  position: absolute;
  top: 0;
  right: 100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, #15886626 0%, #15886640 100%);
  transition: right .2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  z-index: -1
}

.nav_link:hover::before {
  right: 0
}

.nav_link:hover {
  color: #fff
}

.nav_link:focus {
  outline: none;
  background: #158866;
  color: #0d1117
}

.nav_link.active_route {
  background: #15886633;
  color: #fff;
  border: 1px solid #1588664d
}

@media (max-width: 767px) {
  .utility_strip {
    display: none
  }

  .primary_container {
    grid-template-columns: 1fr;
    gap: 20px
  }

  .brand_cluster {
    align-items: center;
    text-align: center
  }

  .nav_spread {
    justify-content: center;
    gap: 8px
  }

  .nav_link {
    padding: 8px 12px;
    font-size: 15px
  }
}

@media (min-width: 768px) and (max-width: 1279px) {
  .primary_container {
    gap: 32px
  }

  .nav_spread {
    gap: 8px
  }

  .nav_link {
    padding: 10px 16px;
    font-size: 15px
  }
}

.base_floor {
  background: linear-gradient(180deg, #0a1420 0%, #0d1117 100%);
  border-top: 2px solid #f24a5f26;
  padding: 64px 0 32px;
  margin-top: 64px
}

.floor_container {
  max-width: 1024px;
  margin: 0 auto;
  padding: 0 32px
}

.floor_grid {
  display: grid;
  grid-template-columns: 1fr 2fr 1fr;
  gap: 64px;
  margin-bottom: 64px
}

.brand_pod {
  display: flex;
  flex-direction: column;
  gap: 12px
}

.footer_logo_frame {
  width: 55px;
  height: 55px;
  padding: 8px;
  background: #ffffff05;
  border: 1px solid #ffffff1a;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 2px 2px 4px 0 #f24a5f14
}

.footer_logo_frame img {
  width: 100%;
  height: 100%;
  object-fit: contain
}

.footer_company_name {
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  line-height: 1.15
}

.footer_description {
  font-size: 15px;
  color: #8a96a3;
  line-height: 1.7;
  margin-top: 8px
}

.links_pod {
  display: flex;
  flex-direction: column;
  gap: 20px
}

.links_heading {
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: .08em;
  line-height: 1.15;
  margin-bottom: 4px
}

.footer_link_list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px
}

.footer_link_list li {
  margin: 0;
  padding: 0
}

.footer_link {
  font-size: 15px;
  color: #b4bfc9;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: color .15s ease-out, padding-left .15s ease-out;
  position: relative;
  padding-left: 0
}

.footer_link::before {
  content: '';
  width: 4px;
  height: 4px;
  background: #F24A5F;
  border-radius: 40px;
  opacity: 0;
  transition: opacity .12s ease-out;
  position: absolute;
  left: -12px;
  top: 50%;
  transform: translateY(-50%)
}

.footer_link:hover {
  color: #F24A5F;
  padding-left: 12px
}

.footer_link:hover::before {
  opacity: 1
}

.footer_link:focus {
  outline: none;
  background: #F24A5F;
  color: #0d1117;
  padding: 4px 8px;
  border-radius: 5px
}

.contact_pod {
  display: flex;
  flex-direction: column;
  gap: 20px
}

.contact_item {
  display: flex;
  flex-direction: column;
  gap: 4px
}

.contact_label {
  font-size: 15px;
  font-weight: 500;
  color: #7d8a99;
  text-transform: uppercase;
  letter-spacing: .05em;
  line-height: 1.15
}

.contact_value {
  font-size: 16px;
  color: #d8dfe6;
  line-height: 1.7;
  font-family: 'JetBrains Mono', monospace
}

.contact_value a {
  color: inherit;
  text-decoration: none;
  transition: color .12s ease-out
}

.contact_value a:hover {
  color: #158866
}

.contact_value a:focus {
  outline: 2px solid #158866;
  outline-offset: 2px;
  background: #0d1117;
  color: #e8edf4
}

.legal_strip {
  padding-top: 32px;
  border-top: 1px solid #f24a5f1a;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px
}

.copyright_text {
  font-size: 15px;
  color: #6e7a87;
  line-height: 1.7
}

.legal_links {
  display: flex;
  gap: 20px;
  flex-wrap: wrap
}

.legal_link {
  font-size: 15px;
  color: #8a96a3;
  text-decoration: none;
  transition: color .12s ease-out
}

.legal_link:hover {
  color: #fff
}

.legal_link:focus {
  outline: none;
  background: #158866;
  color: #0d1117;
  padding: 2px 8px;
  border-radius: 5px
}

.accent_decoration {
  position: absolute;
  width: 120px;
  height: 120px;
  background: radial-gradient(circle, #15886614 0%, transparent 70%);
  pointer-events: none;
  top: -60px;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 40px;
  filter: blur(20px)
}

.brand_pod {
  position: relative
}

@media (max-width: 767px) {
  .floor_grid {
    grid-template-columns: 1fr;
    gap: 32px
  }

  .brand_pod {
    align-items: center;
    text-align: center
  }

  .contact_item {
    align-items: center;
    text-align: center
  }

  .legal_strip {
    flex-direction: column;
    align-items: center;
    text-align: center
  }
}

@media (min-width: 768px) and (max-width: 1279px) {
  .floor_grid {
    grid-template-columns: 1fr 1fr;
    gap: 32px
  }

  .brand_pod {
    grid-column: 1 / -1
  }
}

.consent_overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background: linear-gradient(180deg, #0a0f16 0%, #0d1218 100%);
  border-bottom: 2px solid #1588664d;
  box-shadow: 2px 10px 48px 0 #15886624;
  z-index: 8000;
  padding: 20px 0;
  opacity: 0;
  transform: translateY(-100%);
  transition: opacity .2s ease-out, transform .2s ease-out
}

.consent_overlay.visible {
  opacity: 1;
  transform: translateY(0)
}

.consent_container {
  max-width: 1024px;
  margin: 0 auto;
  padding: 0 32px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 32px;
  align-items: center
}

.consent_text_block {
  display: flex;
  flex-direction: column;
  gap: 8px
}

.consent_headline {
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  line-height: 1.15
}

.consent_description {
  font-size: 15px;
  color: #b4bfc9;
  line-height: 1.7
}

.consent_actions {
  display: flex;
  gap: 12px
}

.consent_btn {
  padding: 12px 32px;
  font-size: 16px;
  font-weight: 500;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  font-family: 'Figtree', sans-serif;
  transition: background .15s ease-out, color .15s ease-out, transform .1s ease-out;
  box-shadow: 2px 2px 4px 0 #15886614
}

.consent_btn.accept {
  background: linear-gradient(135deg, #158866 0%, #117a5a 100%);
  color: #fff
}

.consent_btn.accept:hover {
  background: linear-gradient(135deg, #1a9d77 0%, #158866 100%);
  transform: translateY(-1px);
  box-shadow: 2px 7px 14px 0 #15886617
}

.consent_btn.accept:focus {
  outline: none;
  background: #fff;
  color: #158866;
  box-shadow: 0 0 0 3px #1588664d
}

.consent_btn.decline {
  background: #f24a5f1a;
  color: #F24A5F;
  border: 1px solid #f24a5f4d
}

.consent_btn.decline:hover {
  background: #f24a5f33;
  border-color: #f24a5f80
}

.consent_btn.decline:focus {
  outline: none;
  background: #F24A5F;
  color: #fff;
  box-shadow: 0 0 0 3px #f24a5f4d
}

@media (max-width: 767px) {
  .consent_container {
    grid-template-columns: 1fr;
    gap: 20px
  }

  .consent_actions {
    flex-direction: column;
    width: 100%
  }

  .consent_btn {
    width: 100%
  }
}

::selection {
  background: linear-gradient(90deg, #158866 0%, #F24A5F 100%);
  color: #fff
}

::-moz-selection {
  background: linear-gradient(90deg, #158866 0%, #F24A5F 100%);
  color: #fff
}

.doc-inner {
  max-width: 1024px;
  margin: 0 auto;
  padding: 64px 20px;
  background: #0a1628;
  color: #e8edf5
}

.doc-inner h1 {
  font-size: 48px;
  line-height: 1.15;
  margin: 0 0 32px;
  color: #fff
}

.doc-inner h2 {
  font-size: 34px;
  line-height: 1.15;
  margin: 64px 0 20px;
  color: #fff
}

.doc-inner h3 {
  font-size: 24px;
  line-height: 1.15;
  margin: 32px 0 12px;
  color: #fff
}

.doc-inner h4 {
  font-size: 20px;
  line-height: 1.15;
  margin: 32px 0 12px;
  color: #e8edf5
}

.doc-inner h5 {
  font-size: 16px;
  line-height: 1.15;
  margin: 20px 0 8px;
  color: #e8edf5;
  text-transform: uppercase;
  letter-spacing: .05em
}

.doc-inner h6 {
  font-size: 16px;
  line-height: 1.15;
  margin: 20px 0 8px;
  color: #e8edf5
}

.doc-inner p {
  font-size: 16px;
  line-height: 1.7;
  margin: 0 0 20px;
  color: #e8edf5
}

.doc-inner ul {
  margin: 0 0 20px;
  padding: 0 0 0 32px
}

.policy_content ol {
  margin: 0 0 20px;
  padding: 0 0 32px
}

.doc-inner li {
  font-size: 16px;
  line-height: 1.7;
  margin: 0 0 8px;
  color: #e8edf5
}

.doc-inner strong {
  color: #fff;
  font-weight: 600
}

.doc-inner b {
  color: #fff;
  font-weight: 600
}

.doc-inner table {
  width: 100%;
  margin: 0 0 32px;
  border-collapse: collapse;
  background: #0f1f38;
  border-radius: 10px;
  overflow: hidden
}

.doc-inner thead {
  background: #158866
}

.doc-inner th {
  font-size: 15px;
  line-height: 1.7;
  padding: 12px 20px;
  text-align: left;
  color: #fff;
  font-weight: 600
}

.doc-inner tbody tr {
  border-bottom: 1px solid #1a2f4d
}

.doc-inner tbody tr:last-child {
  border-bottom: none
}

.doc-inner td {
  font-size: 15px;
  line-height: 1.7;
  padding: 12px 20px;
  color: #e8edf5
}

.doc-inner hr {
  border: none;
  height: 1px;
  background: #1a2f4d;
  margin: 32px 0
}

.doc-inner div {
  margin: 0 0 20px
}

@media (max-width: 768px) {
  .doc-inner {
    padding: 32px 12px
  }

  .doc-inner h1 {
    font-size: 34px;
    margin: 0 0 20px
  }

  .doc-inner h2 {
    font-size: 24px;
    margin: 32px 0 12px
  }

  .doc-inner h3 {
    font-size: 20px;
    margin: 20px 0 8px
  }

  .doc-inner h4 {
    font-size: 16px;
    margin: 20px 0 8px
  }

  .doc-inner table {
    font-size: 15px
  }

  .doc-inner th {
    padding: 8px 12px
  }

  .doc-inner td {
    padding: 8px 12px
  }
}

.floral_base {
  background: linear-gradient(168deg, #0a1628 0%, #0d1a2d 100%);
  color: #e8edf2;
  min-height: 100vh;
  overflow-x: hidden
}

.floral_base * {
  box-sizing: border-box
}

.floral_base .intro_wrap {
  max-width: 1024px;
  margin: 0 auto;
  padding: 64px 20px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: center;
  position: relative
}

.floral_base .intro_wrap::before {
  content: '01';
  position: absolute;
  top: 32px;
  right: 20px;
  font-size: 180px;
  font-weight: 700;
  color: #15886614;
  line-height: 1;
  pointer-events: none;
  z-index: 0
}

.floral_base .intro_txt {
  z-index: 1;
  padding-right: 32px
}

.floral_base .intro_txt h1 {
  font-size: 48px;
  line-height: 1.15;
  margin: 0 0 20px;
  font-weight: 700
}

.floral_base .intro_txt h1 span {
  background: linear-gradient(92deg, #158866 0%, #1aa37a 100%);
  padding: 4px 12px;
  display: inline-block;
  animation: colorSweep 1.8s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards
}

@keyframes colorSweep {
  0% {
    background: linear-gradient(92deg, transparent 0%, transparent 100%);
    color: #e8edf2
  }

  100% {
    background: linear-gradient(92deg, #158866 0%, #1aa37a 100%);
    color: #fff
  }
}

.floral_base .intro_txt p {
  font-size: 16px;
  line-height: 1.7;
  margin: 0 0 32px;
  color: #c5d1dc
}

.floral_base .intro_img_zone {
  z-index: 1;
  padding: 64px 32px 32px
}

.floral_base .intro_img_zone img {
  width: 100%;
  height: 380px;
  object-fit: cover;
  display: block;
  border-radius: 10px;
  box-shadow: 2px 10px 48px 0 #15886624
}

.floral_base .expert_panel {
  max-width: 1024px;
  margin: 0 auto;
  padding: 64px 20px;
  background: linear-gradient(185deg, #0f1e35 0%, #0a1628 100%);
  position: relative
}

.floral_base .expert_panel::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 120px;
  height: 120px;
  background: linear-gradient(45deg, transparent 48%, #158866 48%, #158866 52%, transparent 52%), linear-gradient(45deg, transparent 58%, #158866 58%, #158866 62%, transparent 62%), linear-gradient(45deg, transparent 68%, #158866 68%, #158866 72%, transparent 72%);
  opacity: .15;
  pointer-events: none
}

.floral_base .expert_panel h2 {
  font-size: 34px;
  line-height: 1.15;
  margin: 0 0 32px;
  text-align: center;
  font-weight: 700;
  color: #fff
}

.floral_base .expert_grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px
}

.floral_base .expert_card {
  background: linear-gradient(135deg, #0d1a2d 0%, #0a1628 100%);
  padding: 32px;
  border-radius: 10px;
  box-shadow: 2px 7px 14px 0 #f24a5f17;
  display: flex;
  gap: 20px;
  align-items: flex-start;
  transition: transform .15s ease-out, box-shadow .15s ease-out;
  animation: bounceIn .8s cubic-bezier(0.68, -0.55, 0.265, 1.55) backwards
}

.floral_base .expert_card:nth-child(1) {
  animation-delay: .1s
}

.floral_base .expert_card:nth-child(2) {
  animation-delay: .2s
}

@keyframes bounceIn {
  0% {
    opacity: 0;
    transform: scale(0.7)
  }

  60% {
    transform: scale(1.05)
  }

  100% {
    opacity: 1;
    transform: scale(1)
  }
}

.floral_base .expert_card:hover {
  transform: translateY(-4px);
  box-shadow: 2px 10px 48px 0 #f24a5f24
}

.floral_base .expert_card img {
  width: 80px;
  height: 80px;
  object-fit: cover;
  object-position: top;
  border-radius: 5px;
  flex-shrink: 0
}

.floral_base .expert_info h3 {
  font-size: 20px;
  line-height: 1.15;
  margin: 0 0 8px;
  color: #fff;
  font-weight: 700
}

.floral_base .expert_info p {
  font-size: 15px;
  line-height: 1.7;
  margin: 0;
  color: #c5d1dc
}

.floral_base .trust_markers {
  padding: 64px 20px;
  background: linear-gradient(172deg, #15886614 0%, transparent 100%);
  position: relative;
  overflow: hidden
}

.floral_base .trust_markers::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, #158866 50%, transparent 100%)
}

.floral_base .trust_inner {
  max-width: 1024px;
  margin: 0 auto
}

.floral_base .trust_inner h2 {
  font-size: 34px;
  line-height: 1.15;
  margin: 0 0 32px;
  text-align: center;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(88deg, #158866 0%, #F24A5F 100%);
  padding: 12px 20px;
  display: inline-block;
  border-radius: 5px;
  width: 100%;
  text-align: center
}

.floral_base .trust_list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px
}

.floral_base .trust_item {
  text-align: center;
  padding: 32px 20px;
  background: linear-gradient(145deg, #0d1a2d 0%, #0a1628 100%);
  border-radius: 16px;
  box-shadow: 2px 7px 14px 0 #15886617;
  position: relative;
  transition: transform .12s ease-out
}

.floral_base .trust_item:hover {
  transform: scale(1.03)
}

.floral_base .trust_item::before {
  content: '';
  position: absolute;
  top: -8px;
  right: -8px;
  width: 32px;
  height: 32px;
  background: #F24A5F;
  border-radius: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  box-shadow: 2px 2px 4px 0 #f24a5f14
}

.floral_base .trust_item:nth-child(1)::before {
  content: '1'
}

.floral_base .trust_item:nth-child(2)::before {
  content: '2'
}

.floral_base .trust_item:nth-child(3)::before {
  content: '3'
}

.floral_base .trust_item h3 {
  font-size: 20px;
  line-height: 1.15;
  margin: 0 0 12px;
  color: #158866;
  font-weight: 700
}

.floral_base .trust_item p {
  font-size: 15px;
  line-height: 1.7;
  margin: 0;
  color: #c5d1dc
}

.floral_base .metrics_showcase {
  max-width: 1024px;
  margin: 0 auto;
  padding: 64px 20px
}

.floral_base .metrics_showcase h2 {
  font-size: 34px;
  line-height: 1.15;
  margin: 0 0 64px;
  text-align: center;
  font-weight: 700;
  color: #fff
}

.floral_base .metrics_grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px
}

.floral_base .metric_box {
  background: linear-gradient(155deg, #0d1a2d 0%, #0a1628 100%);
  padding: 32px 20px;
  border-radius: 10px;
  text-align: center;
  box-shadow: 2px 2px 4px 0 #15886614;
  position: relative;
  overflow: hidden;
  transition: background .18s ease-out
}

.floral_base .metric_box::before {
  content: '';
  position: absolute;
  top: 0;
  right: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent 0%, #1588661f 50%, transparent 100%);
  transition: right .18s ease-out
}

.floral_base .metric_box:hover::before {
  right: 100%
}

.floral_base .metric_box:hover {
  background: linear-gradient(155deg, #0f1e35 0%, #0d1a2d 100%)
}

.floral_base .metric_num {
  font-size: 48px;
  line-height: 1.15;
  font-weight: 700;
  color: #158866;
  margin: 0 0 8px;
  display: block
}

.floral_base .metric_label {
  font-size: 15px;
  line-height: 1.7;
  color: #c5d1dc;
  margin: 0
}

.floral_base .lasting_value {
  padding: 64px 20px;
  background: url("../images/media-2.jpg") center/cover no-repeat;
  position: relative;
  overflow: hidden
}

.floral_base .lasting_value::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(178deg, #0a1628eb 0%, #0d1a2df2 100%);
  z-index: 1
}

.floral_base .lasting_inner {
  max-width: 1024px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 32px;
  align-items: center
}

.floral_base .lasting_txt h2 {
  font-size: 34px;
  line-height: 1.15;
  margin: 0 0 20px;
  font-weight: 700;
  color: #fff
}

.floral_base .lasting_txt p {
  font-size: 16px;
  line-height: 1.7;
  margin: 0 0 20px;
  color: #c5d1dc
}

.floral_base .lasting_txt p:last-child {
  margin-bottom: 0
}

.floral_base .lasting_txt p:first-of-type {
  text-indent: 32px
}

.floral_base .lasting_sidebar {
  background: linear-gradient(140deg, #15886626 0%, #f24a5f14 100%);
  padding: 32px;
  border-radius: 10px;
  box-shadow: 2px 7px 14px 0 #15886617
}

.floral_base .lasting_sidebar h3 {
  font-size: 20px;
  line-height: 1.15;
  margin: 0 0 12px;
  color: #158866;
  font-weight: 700;
  text-align: center
}

.floral_base .lasting_sidebar p {
  font-size: 15px;
  line-height: 1.7;
  margin: 0;
  color: #e8edf2;
  text-align: center
}

.floral_base .approach_detail {
  max-width: 1024px;
  margin: 0 auto;
  padding: 64px 20px
}

.floral_base .approach_detail h2 {
  font-size: 34px;
  line-height: 1.15;
  margin: 0 0 32px;
  text-align: center;
  font-weight: 700;
  color: #fff
}

.floral_base .approach_mosaic {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: minmax(180px, auto);
  gap: 12px
}

.floral_base .approach_tile {
  background: linear-gradient(148deg, #0d1a2d 0%, #0a1628 100%);
  padding: 20px;
  border-radius: 5px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  box-shadow: 2px 2px 4px 0 #f24a5f14;
  transition: transform .14s ease-out, box-shadow .14s ease-out;
  position: relative;
  overflow: hidden
}

.floral_base .approach_tile::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 4px;
  height: 4px;
  background: #158866;
  border-radius: 40px;
  transition: width .16s ease-out, height .16s ease-out
}

.floral_base .approach_tile:hover::after {
  width: 8px;
  height: 8px
}

.floral_base .approach_tile:hover {
  transform: translateY(-2px);
  box-shadow: 2px 7px 14px 0 #f24a5f17
}

.floral_base .approach_tile:nth-child(1) {
  grid-row: span 2
}

.floral_base .approach_tile:nth-child(4) {
  grid-column: span 2
}

.floral_base .approach_tile:nth-child(6) {
  grid-row: span 2
}

.floral_base .approach_tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 5px;
  position: absolute;
  top: 0;
  left: 0;
  opacity: .2;
  mask-image: linear-gradient(to bottom, #0000004d 0%, #0000 100%);
  -webkit-mask-image: linear-gradient(to bottom, #0000004d 0%, #0000 100%)
}

.floral_base .approach_tile h3 {
  font-size: 20px;
  line-height: 1.15;
  margin: 0 0 8px;
  color: #F24A5F;
  font-weight: 700;
  position: relative;
  z-index: 1
}

.floral_base .approach_tile p {
  font-size: 15px;
  line-height: 1.7;
  margin: 0;
  color: #c5d1dc;
  position: relative;
  z-index: 1
}

.floral_base .field_connection {
  padding: 64px 20px;
  background: linear-gradient(182deg, #0f1e35 0%, #0a1628 100%);
  position: relative
}

.floral_base .field_connection::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 4px;
  background: linear-gradient(90deg, #158866 0%, #F24A5F 100%);
  border-radius: 40px
}

.floral_base .field_connection::after {
  content: '';
  position: absolute;
  top: 0;
  left: calc(50% - 100px);
  width: 8px;
  height: 8px;
  background: #158866;
  border-radius: 40px
}

.floral_base .field_inner {
  max-width: 1024px;
  margin: 0 auto
}

.floral_base .field_inner h2 {
  font-size: 34px;
  line-height: 1.15;
  margin: 0 0 32px;
  text-align: center;
  font-weight: 700;
  color: #fff
}

.floral_base .field_content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: start
}

.floral_base .field_txt p {
  font-size: 16px;
  line-height: 1.7;
  margin: 0 0 20px;
  color: #c5d1dc
}

.floral_base .field_txt p:last-child {
  margin-bottom: 0
}

.floral_base .field_txt p:nth-child(odd) {
  text-indent: 32px
}

.floral_base .field_visual {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px
}

.floral_base .field_visual img {
  width: 100%;
  height: 160px;
  object-fit: cover;
  border-radius: 5px;
  box-shadow: 2px 2px 4px 0 #15886614;
  transition: transform .12s ease-out
}

.floral_base .field_visual img:hover {
  transform: scale(1.04)
}

@media (max-width: 1280px) {
  .floral_base .intro_wrap {
    grid-template-columns: 1fr;
    gap: 32px
  }

  .floral_base .intro_txt {
    padding-right: 0
  }

  .floral_base .intro_img_zone {
    padding: 32px 0 0
  }

  .floral_base .expert_grid {
    grid-template-columns: 1fr
  }

  .floral_base .trust_list {
    grid-template-columns: 1fr
  }

  .floral_base .metrics_grid {
    grid-template-columns: repeat(2, 1fr)
  }

  .floral_base .lasting_inner {
    grid-template-columns: 1fr
  }

  .floral_base .approach_mosaic {
    grid-template-columns: repeat(2, 1fr)
  }

  .floral_base .field_content {
    grid-template-columns: 1fr
  }
}

@media (max-width: 768px) {
  .floral_base .intro_wrap {
    padding: 32px 12px
  }

  .floral_base .intro_img_zone {
    display: none
  }

  .floral_base .intro_txt h1 {
    font-size: 34px
  }

  .floral_base .expert_panel {
    padding: 32px 12px
  }

  .floral_base .expert_panel h2 {
    font-size: 24px
  }

  .floral_base .expert_card {
    padding: 20px;
    flex-direction: column;
    align-items: center;
    text-align: center
  }

  .floral_base .trust_markers {
    padding: 32px 12px
  }

  .floral_base .trust_inner h2 {
    font-size: 24px
  }

  .floral_base .metrics_showcase {
    padding: 32px 12px
  }

  .floral_base .metrics_showcase h2 {
    font-size: 24px;
    margin-bottom: 32px
  }

  .floral_base .metrics_grid {
    grid-template-columns: 1fr
  }

  .floral_base .metric_num {
    font-size: 34px
  }

  .floral_base .lasting_value {
    padding: 32px 12px
  }

  .floral_base .lasting_txt h2 {
    font-size: 24px
  }

  .floral_base .approach_detail {
    padding: 32px 12px
  }

  .floral_base .approach_detail h2 {
    font-size: 24px
  }

  .floral_base .approach_mosaic {
    grid-template-columns: 1fr;
    grid-auto-rows: minmax(140px, auto)
  }

  .floral_base .approach_tile:nth-child(1),
  .floral_base .approach_tile:nth-child(6) {
    grid-row: span 1
  }

  .floral_base .approach_tile:nth-child(4) {
    grid-column: span 1
  }

  .floral_base .field_connection {
    padding: 32px 12px
  }

  .floral_base .field_inner h2 {
    font-size: 24px
  }

  .floral_base .field_visual {
    display: none
  }
}

.abt_pg {
  background: #0a1628;
  color: #e8edf4;
  overflow-x: clip
}

.abt_pg * {
  box-sizing: border-box
}

.abt_pg .intro_banner {
  position: relative;
  max-width: 1024px;
  margin: 0 auto;
  padding: 64px 20px;
  display: flex;
  align-items: center;
  gap: 32px
}

.abt_pg .intro_banner::before {
  content: '';
  position: absolute;
  top: 50%;
  right: 20%;
  width: 280px;
  height: 280px;
  background: linear-gradient(135deg, #15886614, #f24a5f14);
  border-radius: 50%;
  transform: translateY(-50%);
  z-index: 0;
  font-size: 200px;
  line-height: 1;
  color: #1588660d;
  font-weight: 700;
  pointer-events: none
}

.abt_pg .intro_banner::after {
  content: '5';
  position: absolute;
  top: 50%;
  right: 15%;
  transform: translateY(-50%);
  font-size: 200px;
  line-height: 1;
  color: #1588660d;
  font-weight: 700;
  z-index: 0;
  pointer-events: none
}

.abt_pg .img_shape_crop {
  position: relative;
  flex-shrink: 0;
  width: 380px;
  height: 420px;
  clip-path: polygon(0 0, 100% 0, 85% 100%, 0% 100%);
  overflow: hidden;
  z-index: 1
}

.abt_pg .img_shape_crop img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(0.7) brightness(0.85) contrast(1.1) hue-rotate(-8deg);
  transition: filter .18s ease-out
}

.abt_pg .img_shape_crop:hover img {
  filter: saturate(1) brightness(1) contrast(1)
}

.abt_pg .txt_zone {
  flex: 1;
  z-index: 1
}

.abt_pg .txt_zone h1 {
  font-size: 48px;
  line-height: 1.15;
  margin: 0 0 20px;
  font-weight: 700
}

.abt_pg .txt_zone h1 .accent_word {
  color: #158866;
  font-weight: 700
}

.abt_pg .txt_zone p {
  font-size: 16px;
  line-height: 1.7;
  margin: 0;
  color: #c5d0e0
}

@media (max-width: 768px) {
  .abt_pg .intro_banner {
    flex-direction: column;
    padding: 32px 20px;
    gap: 20px
  }

  .abt_pg .img_shape_crop {
    display: none
  }

  .abt_pg .intro_banner::after {
    font-size: 120px;
    right: 10%
  }

  .abt_pg .txt_zone h1 {
    font-size: 34px
  }
}

.abt_pg .mission_split {
  position: relative;
  background: linear-gradient(to bottom, #0f1f38 0%, #0f1f38 50%, #1a2d48 50%, #1a2d48 100%);
  padding: 64px 20px
}

.abt_pg .mission_split::before {
  content: '';
  position: absolute;
  top: -2px;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #1588664d, #f24a5f4d);
  filter: blur(8px)
}

.abt_pg .mission_content {
  max-width: 1024px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
  align-items: start
}

.abt_pg .mission_card {
  background: #0f1f3899;
  padding: 32px;
  border-radius: 16px;
  border: 1px solid #15886626;
  transition: transform .15s ease-out, box-shadow .15s ease-out
}

.abt_pg .mission_card:hover {
  transform: translateY(-4px);
  box-shadow: 2px 10px 48px 0 #15886624
}

.abt_pg .mission_card h2 {
  font-size: 24px;
  line-height: 1.15;
  margin: 0 0 20px;
  padding: 8px 12px;
  background: linear-gradient(90deg, #15886633, #1588660d);
  display: inline-block;
  border-radius: 5px
}

.abt_pg .mission_card p {
  font-size: 16px;
  line-height: 1.7;
  margin: 0 0 12px;
  color: #c5d0e0;
  text-indent: 20px
}

.abt_pg .mission_card p:first-of-type {
  text-indent: 0
}

.abt_pg .mission_card p:last-of-type {
  margin-bottom: 0
}

.abt_pg .mission_card .highlight_text {
  color: #158866;
  font-weight: 700
}

@media (max-width: 768px) {
  .abt_pg .mission_split {
    padding: 32px 20px
  }

  .abt_pg .mission_content {
    grid-template-columns: 1fr;
    gap: 20px
  }

  .abt_pg .mission_card {
    padding: 20px
  }
}

.abt_pg .team_showcase {
  max-width: 1024px;
  margin: 0 auto;
  padding: 64px 20px
}

.abt_pg .team_showcase h2 {
  font-size: 34px;
  line-height: 1.15;
  margin: 0 0 32px;
  text-align: center
}

.abt_pg .team_grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
  margin-bottom: 32px
}

.abt_pg .team_member {
  display: flex;
  gap: 20px;
  align-items: start;
  background: #0f1f3866;
  padding: 20px;
  border-radius: 10px;
  border: 1px solid #f24a5f1a;
  transition: border-color .12s ease
}

.abt_pg .team_member:hover {
  border-color: #f24a5f4d
}

.abt_pg .portrait_wrap {
  flex-shrink: 0;
  width: 120px;
  height: 150px;
  border-radius: 40px;
  overflow: hidden;
  background: #1588661a
}

.abt_pg .portrait_wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
  filter: saturate(0.6);
  transition: filter .16s ease-out
}

.abt_pg .team_member:hover .portrait_wrap img {
  filter: saturate(1)
}

.abt_pg .member_info {
  flex: 1
}

.abt_pg .member_info h3 {
  font-size: 20px;
  line-height: 1.15;
  margin: 0 0 8px;
  color: #158866
}

.abt_pg .member_info .role {
  font-size: 15px;
  line-height: 1.7;
  margin: 0 0 12px;
  color: #8b9bb0
}

.abt_pg .member_info p {
  font-size: 15px;
  line-height: 1.7;
  margin: 0;
  color: #c5d0e0
}

.abt_pg .approach_visual {
  max-width: 1024px;
  margin: 0 auto;
  text-align: center
}

.abt_pg .approach_visual h3 {
  font-size: 24px;
  line-height: 1.15;
  margin: 0 0 32px;
  padding: 8px 12px;
  background: linear-gradient(90deg, #f24a5f33, #f24a5f0d);
  display: inline-block;
  border-radius: 5px
}

.abt_pg .pyramid_chart {
  max-width: 600px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 8px
}

.abt_pg .pyramid_layer {
  height: 64px;
  background: linear-gradient(135deg, #1588664d, #1588661a);
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  line-height: 1.7;
  color: #e8edf4;
  font-weight: 700;
  border: 1px solid #15886633;
  position: relative;
  overflow: hidden;
  transition: background .14s ease-out
}

.abt_pg .pyramid_layer::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, #15886666, transparent);
  transition: left .18s ease-out
}

.abt_pg .pyramid_layer:hover::before {
  left: 100%
}

.abt_pg .pyramid_layer:nth-child(1) {
  width: 100%
}

.abt_pg .pyramid_layer:nth-child(2) {
  width: 85%;
  margin: 0 auto;
  background: linear-gradient(135deg, #15886666, #15886626)
}

.abt_pg .pyramid_layer:nth-child(3) {
  width: 70%;
  margin: 0 auto;
  background: linear-gradient(135deg, #15886680, #15886633)
}

.abt_pg .pyramid_layer:nth-child(4) {
  width: 55%;
  margin: 0 auto;
  background: linear-gradient(135deg, #f24a5f80, #f24a5f33);
  border-color: #f24a5f4d
}

@media (max-width: 768px) {
  .abt_pg .team_showcase {
    padding: 32px 20px
  }

  .abt_pg .team_grid {
    grid-template-columns: 1fr;
    gap: 20px
  }

  .abt_pg .portrait_wrap {
    display: none
  }

  .abt_pg .pyramid_chart {
    max-width: 100%
  }

  .abt_pg .pyramid_layer {
    font-size: 15px;
    height: 56px
  }
}

.abt_pg .values_zigzag {
  max-width: 1024px;
  margin: 0 auto;
  padding: 64px 20px;
  position: relative
}

.abt_pg .values_zigzag::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, #15886666, transparent);
  filter: blur(6px)
}

.abt_pg .values_zigzag h2 {
  font-size: 34px;
  line-height: 1.15;
  margin: 0 0 64px;
  text-align: center
}

.abt_pg .value_row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: center;
  margin-bottom: 64px
}

.abt_pg .value_row:last-child {
  margin-bottom: 0
}

.abt_pg .value_row:nth-child(odd) .value_img {
  order: 1
}

.abt_pg .value_row:nth-child(odd) .value_txt {
  order: 2
}

.abt_pg .value_row:nth-child(even) .value_img {
  order: 2
}

.abt_pg .value_row:nth-child(even) .value_txt {
  order: 1
}

.abt_pg .value_img {
  position: relative;
  width: 100%;
  height: 320px;
  border-radius: 16px;
  overflow: hidden;
  background: #0f1f3899
}

.abt_pg .value_img::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #0a16284d;
  z-index: 1;
  pointer-events: none
}

.abt_pg .value_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(0.6);
  transition: filter .17s ease-out, transform .17s ease-out
}

.abt_pg .value_img:hover img {
  filter: saturate(1);
  transform: scale(1.05)
}

.abt_pg .value_txt h3 {
  font-size: 24px;
  line-height: 1.15;
  margin: 0 0 20px;
  color: #F24A5F
}

.abt_pg .value_txt p {
  font-size: 16px;
  line-height: 1.7;
  margin: 0 0 12px;
  color: #c5d0e0;
  text-indent: 20px
}

.abt_pg .value_txt p:first-of-type {
  text-indent: 0
}

.abt_pg .value_txt p:last-of-type {
  margin-bottom: 0
}

@media (max-width: 768px) {
  .abt_pg .values_zigzag {
    padding: 32px 20px
  }

  .abt_pg .values_zigzag h2 {
    margin-bottom: 32px
  }

  .abt_pg .value_row {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-bottom: 32px
  }

  .abt_pg .value_row:nth-child(odd) .value_img,
  .abt_pg .value_row:nth-child(even) .value_img {
    display: none
  }

  .abt_pg .value_row:nth-child(odd) .value_txt,
  .abt_pg .value_row:nth-child(even) .value_txt {
    order: 1
  }
}

.abt_pg .featured_showcase {
  max-width: 1024px;
  margin: 0 auto;
  padding: 64px 20px
}

.abt_pg .shared_top {
  background: linear-gradient(135deg, #15886626, #f24a5f26);
  padding: 32px;
  border-radius: 16px 16px 0 0;
  text-align: center;
  border: 1px solid #15886633;
  border-bottom: none;
  position: relative;
  overflow: hidden
}

.abt_pg .shared_top::before {
  content: '';
  position: absolute;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  background: #15886614;
  top: -100px;
  left: -50px;
  pointer-events: none
}

.abt_pg .shared_top::after {
  content: '';
  position: absolute;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: #f24a5f14;
  bottom: -90px;
  right: -40px;
  pointer-events: none
}

.abt_pg .shared_top h2 {
  font-size: 34px;
  line-height: 1.15;
  margin: 0 0 12px;
  position: relative;
  z-index: 1
}

.abt_pg .shared_top p {
  font-size: 16px;
  line-height: 1.7;
  margin: 0;
  color: #c5d0e0;
  position: relative;
  z-index: 1
}

.abt_pg .three_cols {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0
}

.abt_pg .col_item {
  background: #0f1f3880;
  padding: 32px 20px;
  border: 1px solid #15886626;
  border-top: none;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: background .15s ease-out
}

.abt_pg .col_item::before {
  content: '';
  position: absolute;
  top: 0;
  right: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, #15886626, transparent);
  transition: right .2s ease-out
}

.abt_pg .col_item:hover {
  background: #0f1f38b3
}

.abt_pg .col_item:hover::before {
  right: 100%
}

.abt_pg .col_item:nth-child(1) {
  border-radius: 0 0 0 16px;
  border-right: none
}

.abt_pg .col_item:nth-child(2) {
  border-right: none
}

.abt_pg .col_item:nth-child(3) {
  border-radius: 0 0 16px 0
}

.abt_pg .col_item .icon_shape {
  width: 64px;
  height: 64px;
  margin: 0 auto 20px;
  background: linear-gradient(135deg, #158866, #0f5f48);
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 2px 7px 14px 0 #15886617
}

.abt_pg .col_item .icon_shape svg {
  width: 32px;
  height: 32px;
  fill: #FFF
}

.abt_pg .col_item h3 {
  font-size: 20px;
  line-height: 1.15;
  margin: 0 0 12px;
  color: #158866
}

.abt_pg .col_item p {
  font-size: 15px;
  line-height: 1.7;
  margin: 0;
  color: #c5d0e0
}

@media (max-width: 1280px) {
  .abt_pg .three_cols {
    grid-template-columns: 1fr
  }

  .abt_pg .col_item:nth-child(1) {
    border-radius: 0;
    border-right: 1px solid #15886626
  }

  .abt_pg .col_item:nth-child(2) {
    border-right: 1px solid #15886626
  }

  .abt_pg .col_item:nth-child(3) {
    border-radius: 0 0 16px 16px
  }
}

@media (max-width: 768px) {
  .abt_pg .featured_showcase {
    padding: 32px 20px
  }

  .abt_pg .shared_top {
    padding: 20px
  }

  .abt_pg .col_item {
    padding: 20px
  }
}

@keyframes cycle_highlight_1 {

  0%,
  100% {
    opacity: .3
  }

  33.33% {
    opacity: 1
  }
}

@keyframes cycle_highlight_2 {

  0%,
  100% {
    opacity: .3
  }

  66.66% {
    opacity: 1
  }
}

@keyframes cycle_highlight_3 {

  0%,
  33.33%,
  100% {
    opacity: .3
  }

  66.66% {
    opacity: 1
  }
}

.abt_pg .pyramid_layer:nth-child(1) {
  animation: cycle_highlight_1 6s ease-in-out infinite
}

.abt_pg .pyramid_layer:nth-child(2) {
  animation: cycle_highlight_2 6s ease-in-out infinite
}

.abt_pg .pyramid_layer:nth-child(3) {
  animation: cycle_highlight_3 6s ease-in-out infinite
}

.abt_pg .pyramid_layer:nth-child(4) {
  animation: cycle_highlight_1 6s ease-in-out infinite 3s
}

.learn_prog {
  background: linear-gradient(142deg, #0a1628 0%, #0d1b2e 100%);
  color: #e8edf2;
  min-height: 100vh;
  overflow-x: clip
}

.learn_prog .title_stage {
  position: relative;
  padding: 64px 20px;
  max-width: 1024px;
  margin: 0 auto;
  overflow: visible
}

.learn_prog .title_stage::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 800px;
  height: 800px;
  background: radial-gradient(circle, #15886626 0%, transparent 70%);
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 1
}

.learn_prog .title_stage::after {
  content: '"';
  position: absolute;
  top: 32px;
  right: 64px;
  font-size: 240px;
  line-height: 1;
  color: #15886614;
  pointer-events: none;
  z-index: 1
}

.learn_prog .animated_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(217deg, #1588661f, #0d1b2e00 70%), linear-gradient(127deg, #f24a5f17, #0d1b2e00 70%), linear-gradient(336deg, #15886614, #0d1b2e00 70%);
  animation: shift_gradient 12s ease-in-out infinite;
  pointer-events: none;
  z-index: 0
}

@keyframes shift_gradient {

  0%,
  100% {
    opacity: 1
  }

  50% {
    opacity: .6
  }
}

.learn_prog .title_content {
  position: relative;
  z-index: 2;
  max-width: 640px;
  padding: 0 0 0 64px
}

.learn_prog .main_heading {
  font-size: 48px;
  line-height: 1.15;
  margin: 0 0 32px;
  font-weight: 700;
  color: #fff;
  animation: rise_in .8s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
  opacity: 0
}

@keyframes rise_in {
  from {
    opacity: 0;
    transform: translateY(32px)
  }

  to {
    opacity: 1;
    transform: translateY(0)
  }
}

.learn_prog .title_link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  color: #158866;
  text-decoration: none;
  transition: gap .15s ease-out;
  animation: rise_in .8s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s forwards;
  opacity: 0
}

.learn_prog .title_link::after {
  content: '→';
  font-size: 20px;
  transition: transform .12s ease-out
}

.learn_prog .title_link:hover {
  gap: 12px
}

.learn_prog .title_link:hover::after {
  transform: translateX(4px)
}

.learn_prog .course_structure {
  position: relative;
  padding: 64px 20px;
  background: linear-gradient(156deg, #0f1f35 0%, #0a1628 100%)
}

.learn_prog .course_structure::before {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 40px;
  background: radial-gradient(circle at 50% 100%, transparent 0, transparent 19px, #0a1628 20px);
  background-size: 40px 40px;
  background-position: 0 0
}

.learn_prog .structure_wrap {
  max-width: 1024px;
  margin: 0 auto
}

.learn_prog .structure_heading {
  font-size: 34px;
  line-height: 1.15;
  text-align: center;
  margin: 0 0 64px;
  color: #fff
}

.learn_prog .modules_grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 32px
}

.learn_prog .module_card {
  background: linear-gradient(135deg, #1588660f 0%, #0d1b2e66 100%);
  border: 1px solid #15886633;
  border-radius: 10px;
  padding: 32px;
  position: relative;
  overflow: hidden;
  box-shadow: 2px 7px 14px 0 #15886617;
  transition: transform .18s ease-out, box-shadow .18s ease-out
}

.learn_prog .module_card::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 64px;
  height: 64px;
  background: #158866;
  clip-path: polygon(100% 0, 100% 100%, 0 0)
}

.learn_prog .module_card:hover {
  transform: translateY(-4px);
  box-shadow: 2px 10px 48px 0 #15886624
}

.learn_prog .module_card:focus-within {
  outline: 3px solid #158866;
  outline-offset: 4px
}

.learn_prog .module_number {
  font-size: 15px;
  color: #158866;
  margin: 0 0 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em
}

.learn_prog .module_title {
  font-size: 20px;
  line-height: 1.7;
  margin: 0 0 20px;
  color: #fff
}

.learn_prog .module_desc {
  font-size: 15px;
  line-height: 1.7;
  margin: 0;
  color: #b8c5d6
}

.learn_prog .instructors_showcase {
  padding: 64px 20px;
  background: #0a1628;
  position: relative
}

.learn_prog .instructors_showcase::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, #f24a5f1f 0%, transparent 70%);
  transform: translate(-50%, -50%);
  pointer-events: none
}

.learn_prog .instructors_wrap {
  max-width: 1024px;
  margin: 0 auto;
  position: relative;
  z-index: 1
}

.learn_prog .instructors_heading {
  font-size: 34px;
  line-height: 1.15;
  text-align: center;
  margin: 0 0 64px;
  color: #fff
}

.learn_prog .instructors_layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: start
}

.learn_prog .instructor_profile {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center
}

.learn_prog .profile_image_wrap {
  width: 180px;
  height: 180px;
  border-radius: 50%;
  overflow: hidden;
  margin: 0 0 20px;
  border: 4px solid #158866;
  box-shadow: 2px 10px 48px 0 #15886624
}

.learn_prog .profile_image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top
}

.learn_prog .instructor_name {
  font-size: 24px;
  line-height: 1.15;
  margin: 0 0 8px;
  color: #fff;
  font-weight: 700
}

.learn_prog .instructor_role {
  font-size: 16px;
  line-height: 1.7;
  margin: 0 0 20px;
  color: #158866
}

.learn_prog .instructor_bio {
  font-size: 15px;
  line-height: 1.7;
  margin: 0;
  color: #b8c5d6;
  max-width: 400px
}

.learn_prog .enrollment_details {
  padding: 64px 20px;
  background: linear-gradient(156deg, #0f1f35 0%, #0a1628 100%)
}

.learn_prog .enrollment_wrap {
  max-width: 1024px;
  margin: 0 auto
}

.learn_prog .enrollment_grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 64px;
  align-items: start
}

.learn_prog .enrollment_text {
  animation: rise_in .8s cubic-bezier(0.175, 0.885, 0.32, 1.275) .3s forwards;
  opacity: 0
}

.learn_prog .enrollment_heading {
  font-size: 34px;
  line-height: 1.15;
  margin: 0 0 32px;
  color: #fff
}

.learn_prog .enrollment_para {
  font-size: 16px;
  line-height: 1.7;
  margin: 0 0 20px;
  color: #b8c5d6;
  text-indent: 20px
}

.learn_prog .enrollment_para:first-of-type {
  text-indent: 0;
  margin: 0
}

.learn_prog .enrollment_visual {
  position: relative;
  animation: rise_in .8s cubic-bezier(0.175, 0.885, 0.32, 1.275) .5s forwards;
  opacity: 0
}

.learn_prog .visual_image_wrap {
  border-radius: 16px;
  overflow: hidden;
  border: 3px solid #158866;
  box-shadow: 2px 10px 48px 0 #15886624;
  position: relative
}

.learn_prog .visual_image_wrap::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(135deg, #15886633 0%, transparent 50%);
  pointer-events: none;
  z-index: 1
}

.learn_prog .visual_image {
  width: 100%;
  height: auto;
  display: block
}

.learn_prog .accent_lines {
  position: absolute;
  bottom: 20px;
  right: 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none
}

.learn_prog .accent_line {
  width: 80px;
  height: 2px;
  background: #F24A5F
}

.learn_prog .accent_line:nth-child(2) {
  width: 60px
}

.learn_prog .accent_line:nth-child(3) {
  width: 40px
}

@media (max-width: 768px) {
  .learn_prog .title_stage {
    padding: 32px 20px
  }

  .learn_prog .title_stage::after {
    font-size: 120px;
    right: 20px;
    top: 20px
  }

  .learn_prog .title_content {
    padding: 0
  }

  .learn_prog .main_heading {
    font-size: 34px;
    margin: 0 0 20px
  }

  .learn_prog .course_structure {
    padding: 32px 20px
  }

  .learn_prog .structure_heading {
    font-size: 24px;
    margin: 0 0 32px
  }

  .learn_prog .modules_grid {
    grid-template-columns: 1fr;
    gap: 20px
  }

  .learn_prog .module_card {
    padding: 20px
  }

  .learn_prog .instructors_showcase {
    padding: 32px 20px
  }

  .learn_prog .instructors_heading {
    font-size: 24px;
    margin: 0 0 32px
  }

  .learn_prog .instructors_layout {
    grid-template-columns: 1fr;
    gap: 32px
  }

  .learn_prog .profile_image_wrap {
    width: 140px;
    height: 140px
  }

  .learn_prog .enrollment_details {
    padding: 32px 20px
  }

  .learn_prog .enrollment_grid {
    grid-template-columns: 1fr;
    gap: 32px
  }

  .learn_prog .enrollment_heading {
    font-size: 24px;
    margin: 0 0 20px
  }

  .learn_prog .visual_image_wrap {
    display: none
  }
}

@media (min-width: 769px) and (max-width: 1280px) {
  .learn_prog .title_stage {
    padding: 48px 32px
  }

  .learn_prog .main_heading {
    font-size: 40px
  }

  .learn_prog .course_structure {
    padding: 48px 32px
  }

  .learn_prog .instructors_showcase {
    padding: 48px 32px
  }

  .learn_prog .enrollment_details {
    padding: 48px 32px
  }
}

.contact_pg {
  background: linear-gradient(212deg, #0a1628 0%, #050b14 100%);
  color: #e8eaed;
  padding: 0;
  margin: 0
}

.contact_pg .form_zone {
  max-width: 1024px;
  margin: 0 auto;
  padding: 64px 20px 96px;
  position: relative;
  overflow: hidden
}

.contact_pg .form_zone::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 680px;
  height: 680px;
  background: radial-gradient(circle, #15886624 0%, transparent 70%);
  pointer-events: none;
  z-index: 0
}

.contact_pg .form_divider {
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 0 0 64px;
  position: relative;
  z-index: 1
}

.contact_pg .form_divider::before,
.contact_pg .form_divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, #1588664d 50%, transparent 100%)
}

.contact_pg .form_divider_num {
  font-size: 15px;
  color: #158866;
  font-weight: 600;
  letter-spacing: .05em
}

.contact_pg .form_wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: start;
  position: relative;
  z-index: 1
}

.contact_pg .form_intro {
  padding: 32px 0
}

.contact_pg .form_intro h1 {
  font-size: 48px;
  line-height: 1.15;
  margin: 0 0 20px;
  color: #fff
}

.contact_pg .form_intro_desc {
  font-size: 16px;
  line-height: 1.7;
  color: #b8bec5;
  margin: 0 0 32px
}

.contact_pg .form_intro_desc+.form_intro_desc {
  text-indent: 32px;
  margin: 0 0 32px
}

.contact_pg .form_intro_link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  color: #158866;
  text-decoration: none;
  transition: color .15s ease-out;
  position: relative
}

.contact_pg .form_intro_link::after {
  content: '→';
  font-size: 20px;
  transition: transform .18s ease-out
}

.contact_pg .form_intro_link:hover {
  color: #1aa87d
}

.contact_pg .form_intro_link:hover::after {
  transform: translateX(4px)
}

.contact_pg .form_container {
  background: linear-gradient(148deg, #1588660f 0%, #f24a5f0a 100%);
  border: 1px solid #15886626;
  border-radius: 16px;
  padding: 32px;
  box-shadow: 2px 10px 48px 0 #15886624
}

.contact_pg .form_container h2 {
  font-size: 24px;
  line-height: 1.15;
  margin: 0 0 8px;
  color: #fff;
  text-align: center;
  background: linear-gradient(94deg, #158866 0%, #1aa87d 100%);
  display: inline-block;
  padding: 8px 20px;
  border-radius: 5px;
  width: 100%
}

.contact_pg .form_container form {
  margin: 32px 0 0
}

.contact_pg .form_group {
  margin: 0 0 20px
}

.contact_pg .form_group label {
  display: block;
  font-size: 15px;
  color: #e8eaed;
  margin: 0 0 8px;
  font-weight: 500
}

.contact_pg .form_group input[type="text"],
.contact_pg .form_group input[type="tel"] {
  width: 100%;
  padding: 12px 20px;
  font-size: 16px;
  color: #e8eaed;
  background: #0a162899;
  border: 1px solid #15886640;
  border-radius: 10px;
  transition: border-color .12s ease, box-shadow .12s ease;
  box-shadow: inset 2px 2px 4px 0 #15886614
}

.contact_pg .form_group input[type="text"]::placeholder,
.contact_pg .form_group input[type="tel"]::placeholder {
  color: #6b7785;
  font-size: 15px
}

.contact_pg .form_group input[type="text"]:focus,
.contact_pg .form_group input[type="tel"]:focus {
  outline: none;
  border-color: #158866;
  box-shadow: inset 2px 2px 4px 0 #15886614 0 0 0 3px #1588661f
}

.contact_pg .form_radio_group {
  margin: 0 0 20px
}

.contact_pg .form_radio_group legend {
  font-size: 15px;
  color: #e8eaed;
  margin: 0 0 12px;
  font-weight: 500
}

.contact_pg .form_radio_options {
  display: flex;
  flex-direction: column;
  gap: 8px
}

.contact_pg .form_radio_item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: #0a162866;
  border: 1px solid #15886626;
  border-radius: 10px;
  cursor: pointer;
  transition: background .14s ease, border-color .14s ease
}

.contact_pg .form_radio_item:hover {
  background: #15886614;
  border-color: #1588664d
}

.contact_pg .form_radio_item input[type="radio"] {
  width: 18px;
  height: 18px;
  margin: 0;
  cursor: pointer;
  accent-color: #158866
}

.contact_pg .form_radio_item label {
  font-size: 15px;
  color: #e8eaed;
  cursor: pointer;
  margin: 0;
  flex: 1
}

.contact_pg .form_privacy {
  margin: 0 0 20px;
  padding: 12px;
  background: #f24a5f0f;
  border: 1px solid #f24a5f33;
  border-radius: 10px
}

.contact_pg .form_privacy label {
  display: flex;
  align-items: start;
  gap: 12px;
  cursor: pointer;
  font-size: 15px;
  line-height: 1.7;
  color: #e8eaed
}

.contact_pg .form_privacy input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 4px 0 0;
  cursor: pointer;
  accent-color: #F24A5F;
  flex-shrink: 0
}

.contact_pg .form_privacy a {
  color: #F24A5F;
  text-decoration: underline;
  transition: color .12s ease
}

.contact_pg .form_privacy a:hover {
  color: #ff6b7d
}

.contact_pg .form_submit {
  width: 100%;
  padding: 16px 32px;
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  background: linear-gradient(94deg, #158866 0%, #1aa87d 100%);
  border: none;
  border-radius: 10px;
  cursor: pointer;
  transition: transform .16s ease-out, box-shadow .16s ease-out;
  box-shadow: 2px 7px 14px 0 #15886617;
  position: relative;
  overflow: hidden
}

.contact_pg .form_submit::before {
  content: '';
  position: absolute;
  top: 0;
  right: 100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(94deg, #1aa87d 0%, #1fc295 100%);
  transition: right .18s ease-out;
  z-index: -1
}

.contact_pg .form_submit:hover::before {
  right: 0
}

.contact_pg .form_submit:hover {
  transform: translateY(-2px);
  box-shadow: 2px 10px 48px 0 #15886624
}

.contact_pg .form_submit:active {
  transform: translateY(0)
}

.contact_pg .info_zone {
  max-width: 1024px;
  margin: 0 auto;
  padding: 64px 20px 96px;
  position: relative
}

.contact_pg .info_divider {
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 0 0 64px
}

.contact_pg .info_divider::before,
.contact_pg .info_divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, #f24a5f4d 50%, transparent 100%)
}

.contact_pg .info_divider_num {
  font-size: 15px;
  color: #F24A5F;
  font-weight: 600;
  letter-spacing: .05em
}

.contact_pg .info_layout {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 32px
}

.contact_pg .info_card {
  background: linear-gradient(162deg, #f24a5f0f 0%, #1588660a 100%);
  border: 1px solid #f24a5f26;
  border-radius: 16px;
  padding: 32px 20px;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: transform .17s ease-out, box-shadow .17s ease-out;
  box-shadow: 2px 2px 4px 0 #f24a5f14
}

.contact_pg .info_card::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, #f24a5f14 0%, transparent 60%);
  opacity: 0;
  transition: opacity .19s ease-out;
  pointer-events: none
}

.contact_pg .info_card:hover::before {
  opacity: 1
}

.contact_pg .info_card:hover {
  transform: translateY(-4px);
  box-shadow: 2px 10px 48px 0 #f24a5f24
}

.contact_pg .info_card_icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 20px;
  background: linear-gradient(135deg, #F24A5F 0%, #ff6b7d 100%);
  border-radius: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  box-shadow: 2px 7px 14px 0 #f24a5f17
}

.contact_pg .info_card_icon svg {
  width: 32px;
  height: 32px;
  fill: #fff
}

.contact_pg .info_card h3 {
  font-size: 20px;
  line-height: 1.15;
  margin: 0 0 12px;
  color: #fff
}

.contact_pg .info_card_value {
  font-size: 16px;
  line-height: 1.7;
  color: #b8bec5;
  margin: 0
}

.contact_pg .info_card_value a {
  color: #F24A5F;
  text-decoration: none;
  transition: color .13s ease
}

.contact_pg .info_card_value a:hover {
  color: #ff6b7d;
  text-decoration: underline
}

.contact_pg .info_card:nth-child(1) {
  animation: info_reveal_1 .6s cubic-bezier(0.175, 0.885, 0.32, 1.1) forwards;
  opacity: 0
}

.contact_pg .info_card:nth-child(2) {
  animation: info_reveal_2 .6s cubic-bezier(0.175, 0.885, 0.32, 1.1) .15s forwards;
  opacity: 0
}

.contact_pg .info_card:nth-child(3) {
  animation: info_reveal_3 .6s cubic-bezier(0.175, 0.885, 0.32, 1.1) .3s forwards;
  opacity: 0
}

@keyframes info_reveal_1 {
  from {
    opacity: 0;
    transform: translateY(32px)
  }

  to {
    opacity: 1;
    transform: translateY(0)
  }
}

@keyframes info_reveal_2 {
  from {
    opacity: 0;
    transform: translateY(32px)
  }

  to {
    opacity: 1;
    transform: translateY(0)
  }
}

@keyframes info_reveal_3 {
  from {
    opacity: 0;
    transform: translateY(32px)
  }

  to {
    opacity: 1;
    transform: translateY(0)
  }
}

@media (max-width: 1280px) {
  .contact_pg .form_wrap {
    grid-template-columns: 1fr;
    gap: 48px
  }

  .contact_pg .info_layout {
    grid-template-columns: 1fr;
    gap: 20px
  }
}

@media (max-width: 768px) {
  .contact_pg .form_zone {
    padding: 48px 12px 64px
  }

  .contact_pg .form_intro h1 {
    font-size: 34px
  }

  .contact_pg .form_container {
    padding: 20px
  }

  .contact_pg .form_container h2 {
    font-size: 20px
  }

  .contact_pg .info_zone {
    padding: 48px 12px 64px
  }

  .contact_pg .info_card {
    padding: 20px 12px
  }

  .contact_pg .form_divider,
  .contact_pg .info_divider {
    margin: 0 0 48px
  }
}

.mstr_cls {
  background: linear-gradient(162deg, #0a1628 0%, #0d1b2e 100%);
  color: #e8eaed;
  min-height: 100vh;
  position: relative;
  overflow-x: clip
}

.mstr_cls::before {
  content: '';
  position: absolute;
  top: 120px;
  right: -80px;
  width: 420px;
  height: 420px;
  border: 3px solid #15886626;
  border-radius: 40px;
  transform: rotate(23deg);
  pointer-events: none
}

.lead_visual {
  max-width: 1024px;
  margin: 0 auto;
  padding: 64px 20px;
  display: flex;
  gap: 32px;
  align-items: flex-start;
  position: relative
}

.lead_visual::after {
  content: '01';
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 240px;
  font-weight: 700;
  color: #1588660a;
  line-height: 1;
  pointer-events: none;
  z-index: 0
}

.img_strip {
  flex-shrink: 0;
  width: 180px;
  position: relative;
  z-index: 1
}

.img_strip img {
  width: 100%;
  height: 520px;
  object-fit: cover;
  border-radius: 10px;
  border: 4px solid #1a2942;
  position: relative;
  box-shadow: 2px 10px 48px 0 #15886624
}

.img_strip::after {
  content: '';
  position: absolute;
  inset: 4px;
  border-radius: 6px;
  background: radial-gradient(ellipse at center, transparent 30%, #0a1628d9 100%);
  pointer-events: none
}

.txt_area {
  flex: 1;
  padding: 32px 0;
  position: relative;
  z-index: 1
}

.txt_area h1 {
  font-size: 48px;
  line-height: 1.15;
  margin: 0 0 32px;
  color: #fff
}

.txt_area h1 .accent_phrase {
  color: #158866;
  font-weight: 700;
  background: linear-gradient(97deg, #1588662e 0%, #15886614 100%);
  padding: 4px 12px;
  border-radius: 5px;
  display: inline-block
}

.txt_area p {
  font-size: 16px;
  line-height: 1.7;
  margin: 0;
  color: #c5c9ce
}

.txt_area p+p {
  text-indent: 32px
}

.txt_area p strong {
  color: #158866;
  font-weight: 700
}

.enroll_zone {
  max-width: 1024px;
  margin: 0 auto;
  padding: 64px 20px;
  position: relative
}

.enroll_zone::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 8px;
  height: 100%;
  background: linear-gradient(174deg, #158866 0%, #1588664d 100%)
}

.enroll_zone::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  height: 12px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 12" preserveAspectRatio="none"><path d="M0,6 L10,0 L20,6 L30,0 L40,6 L50,0 L60,6 L70,0 L80,6 L90,0 L100,6 L110,0 L120,6 L130,0 L140,6 L150,0 L160,6 L170,0 L180,6 L190,0 L200,6 L210,0 L220,6 L230,0 L240,6 L250,0 L260,6 L270,0 L280,6 L290,0 L300,6 L310,0 L320,6 L330,0 L340,6 L350,0 L360,6 L370,0 L380,6 L390,0 L400,6 L410,0 L420,6 L430,0 L440,6 L450,0 L460,6 L470,0 L480,6 L490,0 L500,6 L510,0 L520,6 L530,0 L540,6 L550,0 L560,6 L570,0 L580,6 L590,0 L600,6 L610,0 L620,6 L630,0 L640,6 L650,0 L660,6 L670,0 L680,6 L690,0 L700,6 L710,0 L720,6 L730,0 L740,6 L750,0 L760,6 L770,0 L780,6 L790,0 L800,6 L810,0 L820,6 L830,0 L840,6 L850,0 L860,6 L870,0 L880,6 L890,0 L900,6 L910,0 L920,6 L930,0 L940,6 L950,0 L960,6 L970,0 L980,6 L990,0 L1000,6 L1010,0 L1020,6 L1030,0 L1040,6 L1050,0 L1060,6 L1070,0 L1080,6 L1090,0 L1100,6 L1110,0 L1120,6 L1130,0 L1140,6 L1150,0 L1160,6 L1170,0 L1180,6 L1190,0 L1200,6" fill="none" stroke="%23158866" stroke-width="1.5"/></svg>') repeat-x;
  background-size: 100px 12px
}

.dual_layout {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 32px;
  align-items: start
}

.primary_col {
  background: linear-gradient(143deg, #0f1d32 0%, #121f35 100%);
  background-image: linear-gradient(217deg, #f24a5f0d 0%, transparent 45%), linear-gradient(143deg, #0f1d32 0%, #121f35 100%);
  border-radius: 16px;
  padding: 32px;
  border: 2px solid #1a2942;
  box-shadow: 2px 7px 14px 0 #15886617;
  position: relative;
  overflow: hidden
}

.primary_col::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(251deg, #15886608 0%, transparent 60%);
  pointer-events: none;
  animation: bg_drift_a 8s ease-in-out infinite alternate
}

.primary_col::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(89deg, transparent 40%, #f24a5f0a 100%);
  pointer-events: none;
  animation: bg_drift_b 11s ease-in-out infinite alternate-reverse
}

@keyframes bg_drift_a {
  0% {
    opacity: 1;
    transform: translateX(0)
  }

  100% {
    opacity: .6;
    transform: translateX(-20px)
  }
}

@keyframes bg_drift_b {
  0% {
    opacity: .8;
    transform: translateY(0)
  }

  100% {
    opacity: 1;
    transform: translateY(15px)
  }
}

.primary_col h2 {
  font-size: 34px;
  line-height: 1.15;
  margin: 0 0 32px;
  color: #fff;
  position: relative;
  z-index: 1;
  text-align: center
}

.detail_grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin-bottom: 32px;
  position: relative;
  z-index: 1
}

.stat_card {
  background: #15886614;
  border-radius: 10px;
  padding: 20px;
  border: 1px solid #15886633;
  text-align: center;
  transition: transform .15s ease-out, box-shadow .15s ease-out;
  position: relative
}

.stat_card:hover {
  transform: translateY(-4px);
  box-shadow: 2px 10px 48px 0 #15886624
}

.stat_card .metric {
  font-size: 34px;
  line-height: 1.15;
  color: #158866;
  font-weight: 700;
  margin: 0 0 8px;
  display: block
}

.stat_card .label {
  font-size: 15px;
  line-height: 1.7;
  color: #c5c9ce;
  margin: 0
}

.topics_list {
  list-style: none;
  margin: 0 0 32px;
  padding: 0;
  position: relative;
  z-index: 1
}

.topics_list li {
  font-size: 16px;
  line-height: 1.7;
  color: #e8eaed;
  padding: 12px 12px 12px 44px;
  position: relative;
  margin-bottom: 8px
}

.topics_list li::before {
  content: '';
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background: #158866;
  border-radius: 5px;
  box-shadow: 2px 2px 4px 0 #15886614
}

.topics_list li::after {
  content: '';
  position: absolute;
  left: 18px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  width: 6px;
  height: 10px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff
}

.cta_btn {
  display: inline-block;
  font-size: 16px;
  line-height: 1.15;
  color: #fff;
  background: linear-gradient(97deg, #158866 0%, #0f6b4d 100%);
  padding: 20px 32px;
  border-radius: 10px;
  text-decoration: none;
  font-weight: 700;
  position: relative;
  overflow: hidden;
  transition: transform .12s ease-out;
  box-shadow: 2px 7px 14px 0 #15886617;
  z-index: 1
}

.cta_btn::before {
  content: '';
  position: absolute;
  top: 0;
  right: 100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(97deg, #1a9d77 0%, #158866 100%);
  transition: right .18s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  z-index: -1
}

.cta_btn:hover::before {
  right: 0
}

.cta_btn:hover {
  transform: translateY(-2px)
}

.cta_btn::after {
  content: '→';
  margin-left: 8px;
  display: inline-block;
  transition: transform .15s ease
}

.cta_btn:hover::after {
  transform: translateX(4px)
}

.sidebar_col {
  display: flex;
  flex-direction: column;
  gap: 20px
}

.info_card {
  background: linear-gradient(156deg, #121f35 0%, #0f1d32 100%);
  border-radius: 16px;
  padding: 32px;
  border: 2px solid #1a2942;
  box-shadow: 2px 7px 14px 0 #f24a5f17;
  position: relative
}

.info_card .corner_tag {
  position: absolute;
  top: -1px;
  right: 32px;
  background: #F24A5F;
  color: #fff;
  font-size: 15px;
  line-height: 1.15;
  padding: 8px 12px;
  border-radius: 0 0 10px 10px;
  font-weight: 700;
  box-shadow: 2px 7px 14px 0 #f24a5f17
}

.info_card h3 {
  font-size: 24px;
  line-height: 1.15;
  margin: 0 0 20px;
  color: #fff;
  text-align: center;
  background: #1588661f;
  padding: 12px;
  border-radius: 5px
}

.info_card p {
  font-size: 16px;
  line-height: 1.7;
  margin: 0;
  color: #c5c9ce;
  text-align: center
}

.info_card p+p {
  text-indent: 32px;
  margin-top: 12px
}

.instructor_block {
  background: linear-gradient(156deg, #121f35 0%, #0f1d32 100%);
  border-radius: 16px;
  padding: 32px;
  border: 2px solid #1a2942;
  box-shadow: 2px 7px 14px 0 #f24a5f17;
  text-align: center
}

.instructor_block h3 {
  font-size: 20px;
  line-height: 1.15;
  margin: 0 0 12px;
  color: #fff;
  background: #f24a5f1f;
  padding: 12px;
  border-radius: 5px
}

.instructor_block .name {
  font-size: 24px;
  line-height: 1.15;
  color: #158866;
  font-weight: 700;
  margin: 0 0 8px
}

.instructor_block .bio {
  font-size: 15px;
  line-height: 1.7;
  color: #c5c9ce;
  margin: 0
}

@media (max-width: 1280px) {
  .dual_layout {
    grid-template-columns: 1fr
  }

  .sidebar_col {
    grid-template-columns: repeat(2, 1fr);
    display: grid
  }
}

@media (max-width: 768px) {
  .mstr_cls::before {
    width: 280px;
    height: 280px;
    right: -120px
  }

  .lead_visual {
    flex-direction: column;
    padding: 32px 20px
  }

  .lead_visual::after {
    font-size: 160px;
    top: 40px
  }

  .img_strip {
    display: none
  }

  .txt_area {
    padding: 0
  }

  .txt_area h1 {
    font-size: 34px;
    margin-bottom: 20px
  }

  .txt_area p {
    font-size: 15px
  }

  .enroll_zone {
    padding: 32px 20px
  }

  .dual_layout {
    gap: 20px
  }

  .primary_col {
    padding: 20px
  }

  .primary_col h2 {
    font-size: 24px;
    margin-bottom: 20px
  }

  .detail_grid {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-bottom: 20px
  }

  .stat_card .metric {
    font-size: 24px
  }

  .topics_list li {
    font-size: 15px;
    padding-left: 36px
  }

  .cta_btn {
    width: 100%;
    text-align: center
  }

  .sidebar_col {
    grid-template-columns: 1fr;
    gap: 12px
  }

  .info_card,
  .instructor_block {
    padding: 20px
  }

  .info_card h3 {
    font-size: 20px
  }

  .info_card p {
    font-size: 15px
  }

  .instructor_block .name {
    font-size: 20px
  }
}

.success_confirmation {
  background: linear-gradient(167deg, #0a1420 0%, #151b28 100%);
  min-height: 100vh;
  padding: 64px 20px;
  color: #e8edf2
}

.success_confirmation .confirm_wrapper {
  max-width: 1024px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px
}

.success_confirmation .status_icon {
  width: 120px;
  height: 120px;
  background: linear-gradient(167deg, #158866 0%, #0d5943 100%);
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 2px 10px 48px 0 #15886624;
  animation: icon_appear .7s cubic-bezier(0.68, -0.55, 0.265, 1.55)
}

@keyframes icon_appear {
  0% {
    transform: scale(0) rotate(-180deg);
    opacity: 0
  }

  100% {
    transform: scale(1) rotate(0deg);
    opacity: 1
  }
}

.success_confirmation .status_icon svg {
  width: 64px;
  height: 64px;
  stroke: #fff;
  stroke-width: 3;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round
}

.success_confirmation .status_icon svg path {
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
  animation: checkmark_draw .5s .3s ease-out forwards
}

@keyframes checkmark_draw {
  to {
    stroke-dashoffset: 0
  }
}

.success_confirmation .message_container {
  text-align: center;
  max-width: 640px
}

.success_confirmation .message_container h1 {
  font-size: 48px;
  line-height: 1.15;
  margin: 0 0 20px;
  color: #fff
}

.success_confirmation .message_container .lead_text {
  font-size: 20px;
  line-height: 1.7;
  margin: 0 0 12px;
  color: #b8c5d4
}

.success_confirmation .detail_info {
  background: linear-gradient(167deg, #1a2332 0%, #0f1621 100%);
  border-radius: 16px;
  padding: 32px;
  margin: 20px 0 0;
  box-shadow: 2px 7px 14px 0 #15886617;
  border: 1px solid #15886626
}

.success_confirmation .detail_info p {
  font-size: 16px;
  line-height: 1.7;
  margin: 0;
  color: #d1dbe6
}

.success_confirmation .detail_info p+p {
  margin: 12px 0 0
}

.success_confirmation .detail_info strong {
  color: #158866;
  font-weight: 600
}

.success_confirmation .action_block {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  max-width: 480px;
  margin: 20px 0 0
}

.success_confirmation .action_block .primary_action {
  background: linear-gradient(to right, transparent 0%, #158866 0%);
  background-size: 0 100%;
  background-repeat: no-repeat;
  border: 2px solid #158866;
  color: #158866;
  padding: 16px 32px;
  font-size: 16px;
  border-radius: 10px;
  cursor: pointer;
  transition: background-size .15s ease-out, color .15s ease-out;
  text-decoration: none;
  display: inline-block;
  text-align: center;
  font-weight: 600
}

.success_confirmation .action_block .primary_action:hover {
  background-size: 100% 100%;
  color: #fff
}

.success_confirmation .action_block .secondary_action {
  background: transparent;
  border: 1px solid #b8c5d44d;
  color: #b8c5d4;
  padding: 16px 32px;
  font-size: 16px;
  border-radius: 10px;
  cursor: pointer;
  transition: border-color .12s ease-out, color .12s ease-out;
  text-decoration: none;
  display: inline-block;
  text-align: center
}

.success_confirmation .action_block .secondary_action:hover {
  border-color: #f24a5f99;
  color: #F24A5F
}

.success_confirmation .info_cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  width: 100%;
  max-width: 1024px;
  margin: 32px 0 0
}

.success_confirmation .info_cards .info_item {
  background: linear-gradient(167deg, #1a2332 0%, #121924 100%);
  padding: 32px 20px;
  border-radius: 16px;
  text-align: center;
  box-shadow: 2px 2px 4px 0 #15886614;
  border: 1px solid #ffffff0d
}

.success_confirmation .info_cards .info_item .item_icon {
  width: 48px;
  height: 48px;
  margin: 0 auto 20px;
  background: #1588661f;
  border-radius: 40px;
  display: flex;
  align-items: center;
  justify-content: center
}

.success_confirmation .info_cards .info_item .item_icon svg {
  width: 24px;
  height: 24px;
  stroke: #158866;
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round
}

.success_confirmation .info_cards .info_item h3 {
  font-size: 20px;
  line-height: 1.15;
  margin: 0 0 8px;
  color: #fff
}

.success_confirmation .info_cards .info_item p {
  font-size: 15px;
  line-height: 1.7;
  margin: 0;
  color: #b8c5d4
}

.success_confirmation .contact_strip {
  background: #f24a5f14;
  border: 1px solid #f24a5f33;
  border-radius: 10px;
  padding: 20px 32px;
  margin: 32px 0 0;
  text-align: center;
  max-width: 1024px;
  width: 100%
}

.success_confirmation .contact_strip p {
  font-size: 15px;
  line-height: 1.7;
  margin: 0;
  color: #d1dbe6
}

.success_confirmation .contact_strip a {
  color: #F24A5F;
  text-decoration: none;
  font-weight: 600;
  transition: opacity .1s ease-out
}

.success_confirmation .contact_strip a:hover {
  opacity: .8
}

@media (max-width: 768px) {
  .success_confirmation {
    padding: 32px 20px
  }

  .success_confirmation .status_icon {
    width: 96px;
    height: 96px
  }

  .success_confirmation .status_icon svg {
    width: 48px;
    height: 48px
  }

  .success_confirmation .message_container h1 {
    font-size: 34px
  }

  .success_confirmation .message_container .lead_text {
    font-size: 16px
  }

  .success_confirmation .detail_info {
    padding: 20px
  }

  .success_confirmation .info_cards {
    grid-template-columns: 1fr;
    gap: 12px
  }

  .success_confirmation .info_cards .info_item {
    padding: 20px
  }

  .success_confirmation .contact_strip {
    padding: 20px
  }
}

h1, h2, h3, h4, h5, h6 {word-break: break-word;}