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

body {
  min-height: 100vh;
  scrollbar-gutter: stable;
  font-family: 'Oxygen', sans-serif
}

.hxframe {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  flex-shrink: 0;
  position: relative;
  background-color: #065E8B;
  clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
  box-shadow: 0 5px 28px 0 #065e8b14
}

.hxframe img {
  width: 42px;
  height: 42px;
  object-fit: contain;
  display: block
}

.hdrbar {
  background-color: #FEFEFE;
  box-shadow: 0 1px 5px 0 #065e8b12 0 5px 28px 0 #065e8b14;
  position: relative;
  z-index: 100
}

.hdrinner {
  max-width: 1500px;
  margin: 0 auto;
  padding: 0 32px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: stretch;
  min-height: 88px
}

.hdrleft {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 16px
}

.hdrright {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px
}

.hdrcenter {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 32px
}

.brandname {
  font-size: 23px;
  font-weight: 700;
  line-height: 1.1;
  color: #065E8B;
  text-decoration: none;
  letter-spacing: 0
}

.navlinks {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  list-style: none;
  margin: 0;
  padding: 0
}

.navlinks li a {
  display: block;
  font-family: 'Oxygen', sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.35;
  color: #065E8B;
  text-decoration: none;
  padding: 8px 16px;
  border-radius: 2px;
  transition: background-color .5s cubic-bezier(0.25, 0.46, 0.45, 0.94), color .6s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.navlinks li a:hover {
  background-color: #065E8B;
  color: #FEFEFE
}

.navlinks li a:focus {
  outline: 2px dashed #065E8B;
  outline-offset: 2px
}

.statusdot {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border-radius: 40px;
  background-color: #065e8b12;
  box-shadow: inset 0 2px 4px 0 #065e8b12;
  flex-shrink: 0
}

.statusdot .dot {
  width: 8px;
  height: 8px;
  border-radius: 40px;
  background-color: #F67A51;
  flex-shrink: 0
}

.statusdot .statlabel {
  font-family: 'Oxygen', sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
  color: #065E8B;
  white-space: nowrap
}

.hdraccent {
  width: 100%;
  height: 3px;
  background: linear-gradient(90deg, #065E8B 0%, #F67A51 60%, #fefefe00 100%)
}

.ftrwrap {
  background: linear-gradient(160deg, #042f47 0%, #065E8B 100%);
  color: #FEFEFE
}

.ftrtop {
  max-width: 1500px;
  margin: 0 auto;
  padding: 32px 32px 0;
  border-bottom: 1px solid #fefefe1f;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
  padding-bottom: 32px
}

.ftrbrand {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-shrink: 0
}

.ftrlogoframe {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  background-color: #FEFEFE;
  border-radius: 2px;
  box-shadow: 0 1px 5px 0 #065e8b12;
  flex-shrink: 0
}

.ftrlogoframe img {
  width: 38px;
  height: 38px;
  object-fit: contain;
  display: block
}

.ftrbrandname {
  font-size: 23px;
  font-weight: 700;
  line-height: 1.1;
  color: #FEFEFE;
  text-decoration: none
}

.ftrabout {
  font-size: 15px;
  font-weight: 400;
  line-height: 1.6;
  color: #fefefebf;
  max-width: 420px
}

.ftrcols {
  max-width: 1500px;
  margin: 0 auto;
  padding: 32px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 32px
}

.ftrcolhead {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  color: #F67A51;
  text-transform: uppercase;
  letter-spacing: 0;
  margin: 0 0 16px
}

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

.ftrnavlist li a {
  font-family: 'Oxygen', sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.6;
  color: #fefefecc;
  text-decoration: none;
  border-radius: 2px;
  transition: color .5s ease
}

.ftrnavlist li a:hover {
  color: #FEFEFE
}

.ftrnavlist li a:focus {
  outline: 2px dashed #fefefe99;
  outline-offset: 2px
}

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

.ftrcontactlist li {
  display: flex;
  align-items: flex-start;
  gap: 8px
}

.ftrcontactlist li .ctlabel {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.6;
  color: #fefefe80;
  flex-shrink: 0;
  min-width: 52px
}

.ftrcontactlist li a,
.ftrcontactlist li span {
  font-family: 'Oxygen', sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.6;
  color: #fefefecc;
  text-decoration: none;
  word-break: break-word
}

.ftrcontactlist li a:hover {
  color: #FEFEFE
}

.ftrcontactlist li a:focus {
  outline: 2px dashed #fefefe99;
  outline-offset: 2px
}

.ftrbottom {
  border-top: 1px solid #fefefe14;
  max-width: 1500px;
  margin: 0 auto;
  padding: 16px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap
}

.ftrcopy {
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
  color: #fefefe73
}

.ftrflag {
  display: flex;
  align-items: center;
  gap: 8px
}

.ftrflag .fi {
  width: 20px;
  height: 14px;
  border-radius: 2px;
  overflow: hidden
}

.ftrflag .flaglabel {
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
  color: #fefefe73
}

.ftrpolicynav {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap
}

.ftrpolicynav a {
  font-family: 'Oxygen', sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
  color: #fefefe80;
  text-decoration: none;
  border-radius: 2px;
  transition: color .6s ease
}

.ftrpolicynav a:hover {
  color: #FEFEFE
}

.ftrpolicynav a:focus {
  outline: 2px dashed #fefefe99;
  outline-offset: 2px
}

.cookiepop {
  position: fixed;
  bottom: 32px;
  right: 32px;
  width: 320px;
  background-color: #FEFEFE;
  border-radius: 40px;
  box-shadow: 0 8px 48px 0 #065e8b1c;
  z-index: 8000;
  padding: 32px;
  display: none;
  transform: translateX(-40px);
  opacity: 0;
  transition: transform .42s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity .42s ease
}

.cookiepop.visible {
  transform: translateX(0);
  opacity: 1
}

.cookiedesc {
  font-family: 'Oxygen', sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.6;
  color: #065E8B;
  margin: 0 0 16px
}

.cookietoggles {
  display: none;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 16px
}

.cookietoggles.open {
  display: flex
}

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

.cookietoggleitem .toglabel {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  color: #065E8B
}

.cookietoggleitem .togdesc {
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
  color: #065e8ba6
}

.cookiebtnrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap
}

.cookiebtn {
  font-family: 'Oxygen', sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
  color: #065E8B;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  text-decoration: underline;
  border-radius: 2px;
  transition: color .5s ease;
  min-height: 44px;
  min-width: 44px
}

.cookiebtn:hover {
  color: #F67A51
}

.cookiebtn:focus {
  outline: 2px dashed #065E8B;
  outline-offset: 2px
}

.ministrip {
  position: fixed;
  bottom: 16px;
  right: 32px;
  z-index: 8000;
  display: none
}

.ministrip button {
  font-family: 'Oxygen', sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
  color: #fefefed9;
  background-color: #065E8B;
  border: none;
  border-radius: 40px;
  padding: 8px 16px;
  cursor: pointer;
  min-height: 44px;
  box-shadow: 0 5px 28px 0 #065e8b14;
  transition: background-color .5s ease
}

.ministrip button:hover {
  background-color: #F67A51
}

.ministrip button:focus {
  outline: 2px dashed #065E8B;
  outline-offset: 2px
}

@media (max-width: 1024px) {
  .hdrinner {
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    min-height: auto;
    padding: 16px 32px;
    gap: 16px
  }

  .hdrleft {
    grid-column: 1;
    grid-row: 1
  }

  .hdrcenter {
    grid-column: 2;
    grid-row: 1;
    justify-content: flex-end;
    padding: 0
  }

  .hdrright {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-content: flex-start
  }

  .ftrcols {
    grid-template-columns: 1fr 1fr
  }
}

@media (max-width: 768px) {
  .hdrinner {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto
  }

  .hdrleft {
    grid-column: 1;
    grid-row: 1
  }

  .hdrcenter {
    grid-column: 1;
    grid-row: 2;
    justify-content: flex-start;
    padding: 0
  }

  .hdrright {
    grid-column: 1;
    grid-row: 3;
    justify-content: flex-start
  }

  .ftrtop {
    flex-direction: column;
    align-items: flex-start
  }

  .ftrcols {
    grid-template-columns: 1fr
  }

  .ftrbottom {
    flex-direction: column;
    align-items: flex-start
  }

  .cookiepop {
    right: 16px;
    left: 16px;
    width: auto;
    bottom: 16px
  }

  .ministrip {
    right: 16px
  }
}

@media (max-width: 480px) {
  .hdrinner {
    padding: 16px
  }

  .ftrtop,
  .ftrcols,
  .ftrbottom {
    padding-left: 16px;
    padding-right: 16px
  }

  .navlinks {
    gap: 4px
  }

  .navlinks li a {
    padding: 8px;
    font-size: 13px
  }
}

.terms-info {
  max-width: 1500px;
  margin: 0 auto;
  padding: 64px 32px;
  color: #2a3a4a
}

.terms-info h1 {
  font-size: clamp(45px, 5vw, 62px);
  line-height: 1.1;
  color: #065E8B;
  margin-bottom: 32px;
  margin-top: 0;
  padding-bottom: 16px;
  border-bottom: 2px solid #F67A51
}

.terms-info h2 {
  font-size: clamp(23px, 3vw, 45px);
  line-height: 1.35;
  color: #065E8B;
  margin-top: 64px;
  margin-bottom: 16px
}

.terms-info h3 {
  font-size: clamp(18px, 2.5vw, 23px);
  line-height: 1.35;
  color: #065E8B;
  margin-top: 32px;
  margin-bottom: 16px
}

.terms-info h4 {
  font-size: 18px;
  line-height: 1.6;
  color: #065E8B;
  margin-top: 32px;
  margin-bottom: 8px
}

.terms-info h5 {
  font-size: 15px;
  line-height: 1.6;
  color: #065E8B;
  margin-top: 16px;
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: .04em
}

.terms-info h6 {
  font-size: 13px;
  line-height: 1.6;
  color: #065E8B;
  margin-top: 16px;
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: .06em
}

.terms-info p {
  font-size: clamp(15px, 1.5vw, 18px);
  line-height: 1.8;
  margin-top: 0;
  margin-bottom: 16px;
  color: #2a3a4a
}

.terms-info strong,
.terms-info b {
  font-weight: 700;
  color: #065E8B
}

.terms-info hr {
  border: none;
  border-top: 1px solid #065e8b26;
  margin-top: 64px;
  margin-bottom: 64px
}

.terms-info div {
  font-size: clamp(15px, 1.5vw, 18px);
  line-height: 1.8
}

.terms-info table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 32px;
  margin-bottom: 32px;
  font-size: 15px;
  line-height: 1.6;
  box-shadow: 0 1px 5px 0 #065e8b12;
  border-radius: 2px;
  overflow: hidden
}

.terms-info thead {
  background-color: #065E8B
}

.terms-info thead th {
  color: #FEFEFE;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 16px;
  text-align: left;
  border: none
}

.terms-info tbody tr {
  border-bottom: 1px solid #065e8b1a;
  transition: background-color .5s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.terms-info tbody tr:last-child {
  border-bottom: none
}

.terms-info tbody tr:nth-child(even) {
  background-color: #065e8b08
}

.terms-info tbody tr:hover {
  background-color: #065e8b0f
}

.terms-info td {
  padding: 16px;
  font-size: 15px;
  line-height: 1.6;
  color: #2a3a4a;
  vertical-align: top;
  border: none
}

.terms-info th {
  padding: 16px;
  font-size: 13px;
  line-height: 1.6;
  vertical-align: top;
  border: none
}

@media (max-width: 768px) {
  .terms-info {
    padding: 32px 16px
  }

  .terms-info h2 {
    margin-top: 32px
  }

  .terms-info hr {
    margin-top: 32px;
    margin-bottom: 32px
  }

  .terms-info table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch
  }
}

@media (max-width: 480px) {
  .terms-info {
    padding: 32px 8px
  }

  .terms-info thead th,
  .terms-info td {
    padding: 8px
  }
}

.lrnprog {
  max-width: 1500px;
  margin: 0 auto;
  overflow-x: clip
}

.lrnprog .reveal {
  animation: revealUp .7s cubic-bezier(0.25, 0.46, 0.45, 0.94) both
}

@keyframes revealUp {
  from {
    opacity: 0;
    transform: scale(0.97)
  }

  to {
    opacity: 1;
    transform: scale(1)
  }
}

.lrnprog .titleblk {
  display: grid;
  grid-template-columns: 1fr 2fr 1fr;
  align-items: stretch;
  min-height: 520px;
  position: relative;
  padding: 64px 32px;
  background: #FEFEFE
}

.lrnprog .titleblk::before,
.lrnprog .titleblk::after {
  content: "";
  position: absolute;
  pointer-events: none
}

.lrnprog .titleblk::before {
  top: 40px;
  left: 50%;
  transform: translateX(-50%);
  width: 320px;
  height: 320px;
  border: 1px solid #065e8b17;
  border-radius: 40px;
  rotate: 18deg
}

.lrnprog .titleblk::after {
  top: 80px;
  left: 50%;
  transform: translateX(-50%);
  width: 260px;
  height: 260px;
  border: 1px solid #f67a511c;
  border-radius: 40px;
  rotate: -12deg
}

.lrnprog .titimg {
  position: relative;
  overflow: hidden;
  border-radius: 2px
}

.lrnprog .titimg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  filter: grayscale(30%) contrast(1.05);
  transition: filter .6s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.lrnprog .titimg img:hover {
  filter: grayscale(80%) contrast(1.1)
}

.lrnprog .titimg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, #065e8b38 0%, #065e8b0a 100%);
  pointer-events: none
}

.lrnprog .titimg.right::after {
  background: linear-gradient(200deg, #f67a512e 0%, #f67a5108 100%)
}

.lrnprog .tittext {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 32px;
  position: relative;
  z-index: 2;
  text-align: center
}

.lrnprog .tittext .biglabel {
  font-size: 62px;
  line-height: 1.1;
  font-weight: 900;
  color: #065E8B;
  letter-spacing: -1px;
  display: block;
  margin-bottom: 16px
}

.lrnprog .tittext .sublabel {
  font-size: 23px;
  line-height: 1.35;
  color: #3a3a3a;
  font-weight: 400;
  max-width: 360px
}

.lrnprog .tittext .sublabel span {
  color: #F67A51;
  font-weight: 600
}

.lrnprog .tittext .titbadge {
  display: inline-block;
  margin-top: 32px;
  padding: 8px 32px;
  background: #065E8B;
  color: #FEFEFE;
  font-size: 13px;
  font-weight: 700;
  border-radius: 2px;
  letter-spacing: 2px;
  text-transform: uppercase;
  box-shadow: 0 5px 28px 0 #065e8b14;
  transition: background .5s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow .6s ease;
  text-decoration: none;
  position: relative;
  overflow: hidden
}

.lrnprog .tittext .titbadge::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #F67A51 0%, #065E8B 100%);
  opacity: 0;
  transition: opacity .5s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.lrnprog .tittext .titbadge:hover::before {
  opacity: 1
}

.lrnprog .tittext .titbadge span {
  position: relative;
  z-index: 1
}

.lrnprog .tittext .titbadge:hover {
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.lrnprog .wavdiv {
  width: 100%;
  height: 48px;
  position: relative;
  overflow: hidden
}

.lrnprog .wavdiv svg {
  width: 100%;
  height: 100%
}

.lrnprog .pathblk {
  padding: 64px 32px;
  background: linear-gradient(168deg, #065E8B 0%, #044b72 100%);
  position: relative;
  overflow: hidden
}

.lrnprog .pathblk::before {
  content: "";
  position: absolute;
  top: -64px;
  right: -64px;
  width: 320px;
  height: 320px;
  border: 1px solid #fefefe12;
  border-radius: 40px;
  rotate: 30deg;
  pointer-events: none
}

.lrnprog .pathblk::after {
  content: "";
  position: absolute;
  bottom: -32px;
  left: 64px;
  width: 180px;
  height: 180px;
  border: 1px solid #f67a5121;
  border-radius: 40px;
  rotate: -20deg;
  pointer-events: none
}

.lrnprog .pathtop {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  margin-bottom: 64px;
  position: relative;
  z-index: 1
}

.lrnprog .pathtop .pathhed {
  font-size: 45px;
  line-height: 1.1;
  font-weight: 900;
  color: #FEFEFE;
  text-transform: uppercase;
  letter-spacing: 1px;
  max-width: 480px
}

.lrnprog .pathtop .pathsub {
  font-size: 15px;
  line-height: 1.6;
  color: #fefefebf;
  max-width: 340px;
  text-align: right
}

.lrnprog .steptrail {
  display: flex;
  flex-direction: column;
  gap: 0;
  position: relative;
  z-index: 1
}

.lrnprog .steprow {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 32px;
  align-items: stretch
}

.lrnprog .stepdot {
  display: flex;
  flex-direction: column;
  align-items: center
}

.lrnprog .dot {
  width: 20px;
  height: 20px;
  border-radius: 40px;
  background: #F67A51;
  flex-shrink: 0;
  box-shadow: 0 1px 5px 0 #065e8b12;
  transition: transform .5s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow .6s ease;
  margin-top: 4px
}

.lrnprog .steprow:hover .dot {
  transform: scale(1.3);
  box-shadow: 0 5px 28px 0 #f67a5147
}

.lrnprog .dotline {
  width: 2px;
  flex: 1;
  background: #fefefe26;
  min-height: 32px
}

.lrnprog .steprow:last-child .dotline {
  display: none
}

.lrnprog .stepcontent {
  padding-bottom: 32px
}

.lrnprog .steprow:last-child .stepcontent {
  padding-bottom: 0
}

.lrnprog .stepnum {
  font-size: 13px;
  font-weight: 700;
  color: #F67A51;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 4px
}

.lrnprog .stephed {
  font-size: 18px;
  font-weight: 800;
  color: #FEFEFE;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 8px
}

.lrnprog .steptxt {
  font-size: 15px;
  line-height: 1.6;
  color: #fefefeb8;
  max-width: 560px
}

.lrnprog .steptxt.narrow {
  max-width: 400px
}

.lrnprog .minicard {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 16px;
  background: #fefefe0f;
  border: 1px solid #fefefe1f;
  border-radius: 2px;
  padding: 16px 32px;
  margin-top: 16px;
  box-shadow: 0 1px 5px 0 #065e8b12
}

.lrnprog .minicard .minico {
  width: 36px;
  height: 36px;
  background: #F67A51;
  border-radius: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 5px 28px 0 #f67a5138
}

.lrnprog .minicard .minico svg {
  width: 18px;
  height: 18px
}

.lrnprog .minicard .minitxt {
  font-size: 13px;
  line-height: 1.35;
  color: #FEFEFE;
  font-weight: 600
}

.lrnprog .wavdiv2 {
  width: 100%;
  height: 48px;
  position: relative;
  overflow: hidden
}

.lrnprog .wavdiv2 svg {
  width: 100%;
  height: 100%
}

.lrnprog .modblk {
  padding: 64px 32px;
  background: #FEFEFE;
  position: relative
}

.lrnprog .modblk::before {
  content: "";
  position: absolute;
  top: 32px;
  left: 32px;
  right: 32px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #065e8b21, transparent);
  pointer-events: none
}

.lrnprog .modblk::after {
  content: "";
  position: absolute;
  bottom: 32px;
  left: 32px;
  right: 32px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #065e8b21, transparent);
  pointer-events: none
}

.lrnprog .modtop {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 64px;
  margin-bottom: 64px
}

.lrnprog .modhed {
  font-size: 45px;
  line-height: 1.1;
  font-weight: 900;
  color: #065E8B;
  text-transform: uppercase;
  letter-spacing: 1px;
  flex: 1
}

.lrnprog .modsub {
  font-size: 15px;
  line-height: 1.6;
  color: #3a3a3a;
  max-width: 420px;
  flex: 1;
  padding-top: 8px
}

.lrnprog .modsub.narrow {
  max-width: 300px
}

.lrnprog .modgrid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 32px
}

.lrnprog .modcard {
  border: 1px solid #065e8b1a;
  border-radius: 2px;
  padding: 32px;
  position: relative;
  background: #FEFEFE;
  box-shadow: 0 1px 5px 0 #065e8b12;
  transition: box-shadow .6s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform .5s ease;
  animation: colorCycle 8s ease infinite
}

@keyframes colorCycle {

  0%,
  100% {
    background: #FEFEFE
  }

  50% {
    background: #065e8b08
  }
}

.lrnprog .modcard:hover {
  box-shadow: 0 8px 48px 0 #065e8b1c;
  transform: translateY(-4px)
}

.lrnprog .modcard .cardico {
  width: 44px;
  height: 44px;
  background: #065E8B;
  border-radius: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  box-shadow: 0 5px 28px 0 #065e8b14
}

.lrnprog .modcard .cardico svg {
  width: 22px;
  height: 22px
}

.lrnprog .modcard .cardhed {
  font-size: 15px;
  font-weight: 800;
  color: #065E8B;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 8px
}

.lrnprog .modcard .cardtxt {
  font-size: 13px;
  line-height: 1.6;
  color: #3a3a3a
}

.lrnprog .modcard .cardtag {
  display: inline-block;
  margin-top: 16px;
  padding: 4px 8px;
  background: #f67a511a;
  color: #F67A51;
  font-size: 13px;
  font-weight: 700;
  border-radius: 2px;
  letter-spacing: 1px;
  text-transform: uppercase
}

.lrnprog .modcard.featured {
  border-color: #F67A51;
  background: #FEFEFE
}

.lrnprog .modcard.featured .cardico {
  background: #F67A51
}

.lrnprog .modcard.featured::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 32px;
  right: 32px;
  height: 3px;
  background: #F67A51;
  border-radius: 0 0 2px 2px
}

.lrnprog .revblk {
  padding: 64px 32px;
  background: linear-gradient(168deg, #065e8b0a 0%, #fefefeff 100%);
  position: relative
}

.lrnprog .revblk .frameaccent {
  position: absolute;
  top: 32px;
  left: 32px;
  width: 80px;
  height: 80px;
  border-top: 2px solid #065e8b26;
  border-left: 2px solid #065e8b26;
  border-radius: 2px;
  pointer-events: none
}

.lrnprog .revblk .frameaccent2 {
  position: absolute;
  bottom: 32px;
  right: 32px;
  width: 80px;
  height: 80px;
  border-bottom: 2px solid #f67a512e;
  border-right: 2px solid #f67a512e;
  border-radius: 2px;
  pointer-events: none
}

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

.lrnprog .revleft {
  display: flex;
  flex-direction: column;
  gap: 32px
}

.lrnprog .revhed {
  font-size: 45px;
  line-height: 1.1;
  font-weight: 900;
  color: #065E8B;
  text-transform: uppercase;
  letter-spacing: 1px
}

.lrnprog .revdesc {
  font-size: 15px;
  line-height: 1.6;
  color: #3a3a3a;
  max-width: 420px
}

.lrnprog .revdesc.narrow {
  max-width: 320px
}

.lrnprog .ratingrow {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 16px
}

.lrnprog .ratingnum {
  font-size: 62px;
  line-height: 1.1;
  font-weight: 900;
  color: #065E8B
}

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

.lrnprog .stars {
  display: flex;
  flex-direction: row;
  gap: 4px
}

.lrnprog .star {
  width: 18px;
  height: 18px
}

.lrnprog .ratingcount {
  font-size: 13px;
  color: #888;
  line-height: 1.35
}

.lrnprog .revright {
  display: flex;
  flex-direction: column;
  gap: 32px
}

.lrnprog .revcard {
  background: #FEFEFE;
  border-radius: 2px;
  padding: 32px;
  box-shadow: 0 5px 28px 0 #065e8b14;
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 16px;
  align-items: start;
  transition: box-shadow .7s ease
}

.lrnprog .revcard:hover {
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.lrnprog .revportrait {
  width: 56px;
  height: 70px;
  overflow: hidden;
  border-radius: 2px;
  flex-shrink: 0
}

.lrnprog .revportrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: filter .6s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.lrnprog .revportrait img:hover {
  filter: grayscale(80%)
}

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

.lrnprog .revname {
  font-size: 15px;
  font-weight: 800;
  color: #065E8B;
  text-transform: uppercase;
  letter-spacing: 1px
}

.lrnprog .revloc {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #888
}

.lrnprog .revquote {
  font-size: 15px;
  line-height: 1.6;
  color: #3a3a3a
}

.lrnprog .revcard .revstars {
  display: flex;
  flex-direction: row;
  gap: 4px
}

.lrnprog .revcard .revstars .star {
  width: 14px;
  height: 14px
}

.lrnprog .nopicrev {
  background: #FEFEFE;
  border-radius: 2px;
  padding: 32px;
  box-shadow: 0 5px 28px 0 #065e8b14;
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-align: right;
  transition: box-shadow .7s ease
}

.lrnprog .nopicrev:hover {
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.lrnprog .nopicrev .revname {
  color: #F67A51
}

@media (max-width: 1024px) {
  .lrnprog .titleblk {
    grid-template-columns: 1fr 2fr 1fr;
    min-height: 420px
  }

  .lrnprog .modgrid {
    grid-template-columns: 1fr 1fr
  }

  .lrnprog .revinner {
    grid-template-columns: 1fr;
    gap: 32px
  }

  .lrnprog .pathtop {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px
  }

  .lrnprog .pathtop .pathsub {
    text-align: left
  }
}

@media (max-width: 768px) {
  .lrnprog .titleblk {
    grid-template-columns: 1fr;
    grid-template-rows: 240px auto;
    min-height: unset;
    padding: 32px 16px
  }

  .lrnprog .titimg.right {
    display: none
  }

  .lrnprog .titimg {
    height: 240px
  }

  .lrnprog .tittext .biglabel {
    font-size: 45px
  }

  .lrnprog .pathblk,
  .lrnprog .modblk,
  .lrnprog .revblk {
    padding: 64px 16px
  }

  .lrnprog .modgrid {
    grid-template-columns: 1fr
  }

  .lrnprog .modtop {
    flex-direction: column;
    gap: 16px
  }

  .lrnprog .steprow {
    grid-template-columns: 36px 1fr;
    gap: 16px
  }

  .lrnprog .ratingnum {
    font-size: 45px
  }
}

@media (max-width: 480px) {
  .lrnprog .titleblk {
    padding: 32px 8px
  }

  .lrnprog .tittext .biglabel {
    font-size: 45px
  }

  .lrnprog .pathtop .pathhed {
    font-size: 23px
  }

  .lrnprog .modhed {
    font-size: 23px
  }

  .lrnprog .revhed {
    font-size: 23px
  }

  .lrnprog .revcard {
    grid-template-columns: 1fr
  }

  .lrnprog .minicard {
    flex-direction: column;
    align-items: flex-start;
    padding: 16px
  }
}

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

.sub .frame {
  max-width: 1500px;
  margin: 0 auto;
  padding: 0 32px
}

.sub .topband {
  padding: 64px 0 48px;
  background: #FEFEFE;
  position: relative
}

.sub .topband .frame {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 64px
}

.sub .imgcol {
  flex: 0 0 420px;
  position: relative
}

.sub .imgcol .imgwrap {
  width: 420px;
  height: 280px;
  overflow: hidden;
  border-radius: 2px;
  border: 8px solid #065E8B;
  outline: 3px solid #F67A51;
  outline-offset: 6px;
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.sub .imgcol .imgwrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: sepia(0.35) contrast(1.08) brightness(0.96) saturate(0.8);
  transition: filter .6s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.sub .imgcol .imgwrap img:hover {
  filter: sepia(0) contrast(1) brightness(1) saturate(0)
}

.sub .dotpath {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0;
  margin-top: 16px
}

.sub .dot {
  width: 8px;
  height: 8px;
  border-radius: 40px;
  background: #065E8B;
  flex-shrink: 0
}

.sub .dot.accent {
  background: #F67A51;
  width: 12px;
  height: 12px
}

.sub .dotline {
  flex: 1;
  height: 2px;
  background: #065E8B;
  opacity: .18;
  min-width: 16px
}

.sub .textcol {
  flex: 1;
  min-width: 0
}

.sub .textcol .pretag {
  font-size: 13px;
  line-height: 1.35;
  color: #F67A51;
  text-transform: uppercase;
  letter-spacing: .12em;
  margin-bottom: 16px;
  display: block
}

.sub .textcol h1 {
  font-size: clamp(23px, 4vw, 45px);
  line-height: 1.1;
  color: #065E8B;
  font-weight: 800;
  text-transform: uppercase;
  margin: 0 0 16px
}

.sub .textcol h1 .outlined {
  -webkit-text-stroke: 2px #065E8B;
  color: transparent
}

.sub .textcol .slogan {
  font-size: 18px;
  line-height: 1.6;
  color: #3a5a6e;
  font-style: italic;
  border-top: 2px solid #F67A51;
  padding-top: 16px;
  margin: 0
}

.sub .curvediv {
  width: 100%;
  line-height: 0;
  overflow: hidden
}

.sub .curvediv svg {
  display: block;
  width: 100%
}

.sub .midband {
  background: #065E8B;
  padding: 64px 0;
  position: relative
}

.sub .midband .frame {
  display: flex;
  flex-direction: column;
  gap: 32px
}

.sub .midtop {
  display: flex;
  flex-direction: row;
  gap: 64px;
  align-items: flex-start
}

.sub .midleft {
  flex: 1;
  min-width: 0
}

.sub .midleft h2 {
  font-size: clamp(23px, 3vw, 45px);
  line-height: 1.1;
  color: #FEFEFE;
  font-weight: 800;
  text-transform: uppercase;
  margin: 0 0 16px
}

.sub .midleft h2 .outlined {
  -webkit-text-stroke: 2px #F67A51;
  color: transparent
}

.sub .midleft p {
  font-size: 15px;
  line-height: 1.6;
  color: #fefefed1;
  margin: 0 0 16px
}

.sub .midleft p.narrow {
  max-width: 72%
}

.sub .midleft p.wide {
  max-width: 100%
}

.sub .midright {
  flex: 0 0 340px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-top: 8px
}

.sub .infocard {
  background: #fefefe12;
  border-radius: 2px;
  padding: 16px;
  box-shadow: 0 1px 5px 0 #065e8b12;
  border-top: 3px solid #F67A51;
  text-align: right;
  transition: background .5s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.sub .infocard:hover {
  background: #fefefe21
}

.sub .infocard .iclabel {
  font-size: 13px;
  line-height: 1.35;
  color: #fefefe99;
  display: block;
  margin-bottom: 4px
}

.sub .infocard .icval {
  font-size: 23px;
  line-height: 1.35;
  color: #FEFEFE;
  font-weight: 700
}

.sub .trailrow {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap
}

.sub .trailitem {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px
}

.sub .traildot {
  width: 10px;
  height: 10px;
  border-radius: 40px;
  background: #fefefe4d;
  flex-shrink: 0;
  position: relative;
  transition: background .5s ease
}

.sub .traildot.active {
  background: #F67A51;
  box-shadow: 0 0 0 4px #f67a5140
}

.sub .trailconnect {
  width: 32px;
  height: 2px;
  background: #fefefe33
}

.sub .traillabel {
  font-size: 13px;
  line-height: 1.35;
  color: #fefefeb3
}

.sub .trailitem.active .traillabel {
  color: #FEFEFE;
  font-weight: 600
}

.sub .curvediv2 {
  width: 100%;
  line-height: 0;
  overflow: hidden
}

.sub .curvediv2 svg {
  display: block;
  width: 100%
}

.sub .botband {
  background: #FEFEFE;
  padding: 64px 0
}

.sub .botband .frame {
  display: flex;
  flex-direction: row;
  gap: 64px;
  align-items: flex-start
}

.sub .botleft {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 32px
}

.sub .botleft h3 {
  font-size: clamp(18px, 2.5vw, 23px);
  line-height: 1.35;
  color: #065E8B;
  font-weight: 800;
  text-transform: uppercase;
  margin: 0
}

.sub .channelgrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px
}

.sub .chancard {
  border-radius: 2px;
  padding: 16px;
  background: #FEFEFE;
  box-shadow: 0 5px 28px 0 #065e8b14;
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: box-shadow .6s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform .6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  cursor: default
}

.sub .chancard:hover {
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.sub .chancard:active {
  transform: scale(1.04);
  transition: transform .12s steps(3, end), box-shadow .6s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.sub .chancard .chicon {
  width: 32px;
  height: 32px;
  border-radius: 2px;
  background: #065E8B;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0
}

.sub .chancard .chicon svg {
  width: 16px;
  height: 16px;
  fill: #FEFEFE
}

.sub .chancard .chtitle {
  font-size: 15px;
  line-height: 1.35;
  color: #065E8B;
  font-weight: 700
}

.sub .chancard .chdesc {
  font-size: 13px;
  line-height: 1.6;
  color: #4a6a7a;
  margin: 0
}

.sub .botright {
  flex: 0 0 360px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-top: 4px
}

.sub .expectbox {
  border-radius: 2px;
  padding: 32px;
  background: #065E8B;
  box-shadow: 0 8px 48px 0 #065e8b1c;
  inset-shadow: inset 0 4px 6px 0 #065e8b26
}

.sub .expectbox h4 {
  font-size: 15px;
  line-height: 1.35;
  color: #F67A51;
  font-weight: 700;
  text-transform: uppercase;
  margin: 0 0 16px
}

.sub .expectlist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px
}

.sub .expectlist li {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 8px;
  font-size: 15px;
  line-height: 1.6;
  color: #fefefee0
}

.sub .expectlist li .bulb {
  width: 6px;
  height: 6px;
  border-radius: 40px;
  background: #F67A51;
  flex-shrink: 0;
  margin-top: 8px
}

.sub .freqbox {
  border-radius: 2px;
  padding: 16px;
  background: #065e8b0f;
  box-shadow: inset 0 2px 6px 0 #065e8b12
}

.sub .freqbox .fqlabel {
  font-size: 13px;
  line-height: 1.35;
  color: #065E8B;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 8px;
  display: block
}

.sub .freqbox p {
  font-size: 15px;
  line-height: 1.6;
  color: #3a5a6e;
  margin: 0
}

.sub .flagrow {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  margin-top: 8px
}

.sub .flagrow .fi {
  font-size: 18px;
  border-radius: 2px;
  box-shadow: 0 1px 5px 0 #065e8b12
}

.sub .flagrow .flaglabel {
  font-size: 13px;
  line-height: 1.35;
  color: #4a6a7a
}

@keyframes slideinleft {
  from {
    opacity: 0;
    transform: translateX(-40px)
  }

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

@keyframes slideinright {
  from {
    opacity: 0;
    transform: translateX(40px)
  }

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

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

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

.sub .imgcol {
  animation: slideinleft .7s cubic-bezier(0.25, 0.46, 0.45, 0.94) both
}

.sub .textcol {
  animation: slideinright .7s cubic-bezier(0.25, 0.46, 0.45, 0.94) .15s both
}

.sub .midleft {
  animation: slideinleft .6s cubic-bezier(0.25, 0.46, 0.45, 0.94) .1s both
}

.sub .midright {
  animation: slideinright .6s cubic-bezier(0.25, 0.46, 0.45, 0.94) .2s both
}

.sub .botleft {
  animation: slideinup .7s cubic-bezier(0.25, 0.46, 0.45, 0.94) .1s both
}

.sub .botright {
  animation: slideinright .7s cubic-bezier(0.25, 0.46, 0.45, 0.94) .25s both
}

@media (max-width: 1024px) {
  .sub .topband .frame {
    gap: 32px
  }

  .sub .imgcol {
    flex: 0 0 320px
  }

  .sub .imgcol .imgwrap {
    width: 320px;
    height: 215px
  }

  .sub .midtop {
    flex-direction: column;
    gap: 32px
  }

  .sub .midright {
    flex: none;
    width: 100%;
    flex-direction: row;
    flex-wrap: wrap
  }

  .sub .infocard {
    flex: 1 1 140px
  }

  .sub .botband .frame {
    flex-direction: column;
    gap: 32px
  }

  .sub .botright {
    flex: none;
    width: 100%
  }
}

@media (max-width: 768px) {
  .sub .topband .frame {
    flex-direction: column;
    gap: 32px
  }

  .sub .imgcol {
    flex: none;
    width: 100%
  }

  .sub .imgcol .imgwrap {
    width: 100%;
    height: 220px
  }

  .sub .midleft p.narrow {
    max-width: 100%
  }

  .sub .channelgrid {
    grid-template-columns: 1fr
  }

  .sub .frame {
    padding: 0 16px
  }

  .sub .topband {
    padding: 32px 0
  }

  .sub .midband {
    padding: 32px 0
  }

  .sub .botband {
    padding: 32px 0
  }
}

@media (max-width: 480px) {
  .sub .midright {
    flex-direction: column
  }

  .sub .expectbox {
    padding: 16px
  }

  .sub .trailrow {
    flex-direction: column;
    align-items: flex-start
  }

  .sub .trailconnect {
    display: none
  }
}

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

.opn .pg {
  max-width: 1500px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 32px;
  padding-right: 32px
}

.opn .s1 {
  padding-top: 64px;
  padding-bottom: 64px;
  background-color: #f4f0eb;
  position: relative
}

.opn .s1 .circles {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  overflow: hidden
}

.opn .s1 .circles span {
  position: absolute;
  border-radius: 50%;
  border: 1.5px solid #065e8b1a
}

.opn .s1 .circles span:nth-child(1) {
  width: 320px;
  height: 320px;
  top: -80px;
  left: -100px
}

.opn .s1 .circles span:nth-child(2) {
  width: 180px;
  height: 180px;
  top: 40px;
  left: -40px;
  border-color: #f67a511a
}

.opn .s1 .circles span:nth-child(3) {
  width: 500px;
  height: 500px;
  bottom: -200px;
  left: 10%;
  border-color: #065e8b0f
}

.opn .s1 .circles span:nth-child(4) {
  width: 240px;
  height: 240px;
  top: 20px;
  right: 15%;
  border-color: #f67a5114
}

.opn .s1 .row {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 64px
}

.opn .s1 .left {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  gap: 32px;
  padding-top: 32px
}

.opn .s1 .right {
  flex: 0 0 480px;
  position: relative
}

.opn .s1 .imgwrap {
  position: relative;
  border-radius: 2px;
  overflow: hidden;
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.opn .s1 .imgwrap img {
  width: 100%;
  height: 580px;
  object-fit: cover;
  object-position: center;
  display: block;
  filter: grayscale(8%) contrast(1.04);
  transition: filter .6s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.opn .s1 .imgwrap img:hover {
  filter: grayscale(100%) contrast(1.0)
}

.opn .s1 .imgwrap::before {
  content: "";
  position: absolute;
  inset: 6px;
  border: 1.5px solid #f67a5159;
  border-radius: 2px;
  z-index: 1;
  pointer-events: none
}

.opn .s1 .imgwrap::after {
  content: "";
  position: absolute;
  inset: 10px;
  border: 1px solid #065e8b2e;
  border-radius: 2px;
  z-index: 1;
  pointer-events: none
}

.opn .s1 .tag {
  display: inline-block;
  font-size: 13px;
  line-height: 1.35;
  color: #F67A51;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-weight: 600
}

.opn .s1 .h1big {
  font-size: clamp(45px, 5vw, 62px);
  line-height: 1.1;
  color: #065E8B;
  font-weight: 800;
  margin: 0
}

.opn .s1 .h1sub {
  font-size: clamp(23px, 3vw, 45px);
  line-height: 1.35;
  color: #2a2a2a;
  font-weight: 400;
  margin: 0
}

.opn .s1 .lead {
  font-size: 18px;
  line-height: 1.6;
  color: #3a3a3a;
  max-width: 480px
}

.opn .s1 .btns {
  display: flex;
  flex-direction: row;
  gap: 16px;
  flex-wrap: wrap
}

.opn .s1 .btn {
  display: inline-block;
  font-size: 15px;
  line-height: 1.35;
  font-weight: 600;
  padding: 16px 32px;
  border-radius: 2px;
  text-decoration: none;
  border: none;
  cursor: pointer;
  background: linear-gradient(135deg, #065E8B 0%, #054d74 100%);
  color: #FEFEFE;
  background-size: 200% 200%;
  background-position: 0 0;
  transition: background-position .5s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow .5s ease;
  box-shadow: 0 5px 28px 0 #065e8b14
}

.opn .s1 .btn:hover {
  background-position: 100% 100%;
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.opn .s1 .btn:focus {
  outline: 2px solid #F67A51;
  outline-offset: 3px
}

.opn .s1 .btn.alt {
  background: linear-gradient(135deg, #3a3a3a 0%, #222 100%);
  color: #FEFEFE
}

.opn .s1 .btn.alt:hover {
  background-position: 100% 100%
}

.opn .s1 .badge {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  margin-top: 8px
}

.opn .s1 .badge .flag {
  font-size: 18px
}

.opn .s1 .badge p {
  font-size: 13px;
  line-height: 1.35;
  color: #666;
  margin: 0
}

.opn .s2 {
  padding-top: 64px;
  padding-bottom: 64px;
  background: #FEFEFE
}

.opn .s2 .row {
  display: flex;
  flex-direction: row;
  gap: 64px;
  align-items: flex-start
}

.opn .s2 .col {
  flex: 1 1 0
}

.opn .s2 .col.shifted {
  padding-top: 64px
}

.opn .s2 .eyebrow {
  font-size: 13px;
  line-height: 1.35;
  color: #F67A51;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 600;
  margin-bottom: 16px
}

.opn .s2 h2 {
  font-size: clamp(23px, 3vw, 45px);
  line-height: 1.35;
  color: #065E8B;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  margin: 0 0 32px
}

.opn .s2 .para {
  font-size: 15px;
  line-height: 1.6;
  color: #3a3a3a;
  margin: 0 0 16px
}

.opn .s2 .para.wide {
  max-width: 100%
}

.opn .s2 .para.narrow {
  max-width: 80%
}

.opn .s2 .imgwrap2 {
  border-radius: 2px;
  overflow: hidden;
  box-shadow: 0 5px 28px 0 #065e8b14;
  position: relative
}

.opn .s2 .imgwrap2::before {
  content: "";
  position: absolute;
  inset: 5px;
  border: 1.5px solid #065e8b1f;
  border-radius: 2px;
  z-index: 1;
  pointer-events: none
}

.opn .s2 .imgwrap2::after {
  content: "";
  position: absolute;
  inset: 9px;
  border: 1px solid #f67a5133;
  border-radius: 2px;
  z-index: 1;
  pointer-events: none
}

.opn .s2 .imgwrap2 img {
  width: 100%;
  height: 380px;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: filter .7s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.opn .s2 .imgwrap2 img:hover {
  filter: grayscale(100%)
}

.opn .s2 .pillars {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 32px
}

.opn .s2 .pillar {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: flex-start;
  padding: 16px;
  border-radius: 2px;
  background: #f4f0eb;
  box-shadow: 0 1px 5px 0 #065e8b12;
  transition: box-shadow .5s ease, transform .5s ease
}

.opn .s2 .pillar:hover {
  box-shadow: 0 5px 28px 0 #065e8b14;
  transform: scale(1.03)
}

.opn .s2 .pillars:hover .pillar:not(:hover) {
  transform: scale(0.97)
}

.opn .s2 .pillar .dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #F67A51;
  flex-shrink: 0;
  margin-top: 4px
}

.opn .s2 .pillar h4 {
  font-size: 15px;
  line-height: 1.35;
  color: #065E8B;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  margin: 0 0 4px
}

.opn .s2 .pillar p {
  font-size: 13px;
  line-height: 1.6;
  color: #3a3a3a;
  margin: 0
}

.opn .s3 {
  padding-top: 64px;
  padding-bottom: 64px;
  background: linear-gradient(168deg, #065E8B 0%, #054472 100%);
  position: relative
}

.opn .s3::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 60% 70% at 50% 50%, #ffffff0f 0%, transparent 70%);
  pointer-events: none
}

.opn .s3 .eyebrow {
  font-size: 13px;
  line-height: 1.35;
  color: #f67a51e6;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 600;
  margin-bottom: 16px
}

.opn .s3 h2 {
  font-size: clamp(23px, 3vw, 45px);
  line-height: 1.35;
  color: #FEFEFE;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  margin: 0 0 32px;
  max-width: 600px
}

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

.opn .s3 .card {
  background: #fefefe12;
  border-radius: 2px;
  padding: 32px;
  box-shadow: 0 1px 5px 0 #065e8b12;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: background .6s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform .5s ease
}

.opn .s3 .cards:hover .card:not(:hover) {
  transform: scale(0.97);
  background: #fefefe0a
}

.opn .s3 .card:hover {
  transform: scale(1.03);
  background: #fefefe1f
}

.opn .s3 .card .portrait {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0
}

.opn .s3 .card .portrait img {
  width: 72px;
  height: 72px;
  object-fit: cover;
  object-position: center;
  display: block
}

.opn .s3 .card .quote {
  font-size: 15px;
  line-height: 1.6;
  color: #fefefee0;
  margin: 0;
  font-style: italic
}

.opn .s3 .card .person {
  display: flex;
  flex-direction: column;
  gap: 4px
}

.opn .s3 .card .name {
  font-size: 15px;
  line-height: 1.35;
  color: #FEFEFE;
  font-weight: 700
}

.opn .s3 .card .role {
  font-size: 13px;
  line-height: 1.35;
  color: #f67a51d9
}

.opn .s3 .card .result {
  font-size: 13px;
  line-height: 1.6;
  color: #fefefea6;
  border-top: 1px solid #fefefe1f;
  padding-top: 16px;
  margin-top: 4px
}

.opn .s4 {
  padding-top: 64px;
  padding-bottom: 64px;
  background: #f4f0eb;
  position: relative
}

.opn .s4 .eyebrow {
  font-size: 13px;
  line-height: 1.35;
  color: #F67A51;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 600;
  margin-bottom: 16px
}

.opn .s4 h2 {
  font-size: clamp(23px, 3vw, 45px);
  line-height: 1.35;
  color: #065E8B;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  margin: 0 0 32px;
  max-width: 700px
}

.opn .s4 .trail {
  display: flex;
  flex-direction: column;
  gap: 0;
  position: relative;
  padding-left: 32px
}

.opn .s4 .trail::before {
  content: "";
  position: absolute;
  left: 7px;
  top: 12px;
  bottom: 12px;
  width: 2px;
  background: linear-gradient(180deg, #065E8B 0%, #F67A51 100%)
}

.opn .s4 .step {
  display: flex;
  flex-direction: row;
  gap: 32px;
  align-items: flex-start;
  padding: 32px 0;
  position: relative
}

.opn .s4 .step::before {
  content: "";
  position: absolute;
  left: -30px;
  top: 38px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #FEFEFE;
  border: 3px solid #065E8B;
  transition: border-color .5s ease, background .5s ease
}

.opn .s4 .step:hover::before {
  background: #F67A51;
  border-color: #F67A51
}

.opn .s4 .step .num {
  font-size: 45px;
  line-height: 1.1;
  color: #065e8b1f;
  font-weight: 900;
  flex-shrink: 0;
  width: 64px;
  text-align: right;
  transition: color .5s ease
}

.opn .s4 .step:hover .num {
  color: #f67a5140
}

.opn .s4 .step .body {
  flex: 1 1 0
}

.opn .s4 .step h4 {
  font-size: 18px;
  line-height: 1.35;
  color: #065E8B;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  margin: 0 0 8px
}

.opn .s4 .step p {
  font-size: 15px;
  line-height: 1.6;
  color: #3a3a3a;
  margin: 0;
  max-width: 520px
}

.opn .s4 .imgside {
  float: right;
  width: 340px;
  margin-left: 32px;
  margin-bottom: 32px;
  border-radius: 2px;
  overflow: hidden;
  box-shadow: 0 5px 28px 0 #065e8b14
}

.opn .s4 .imgside img {
  width: 100%;
  height: 300px;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: filter .7s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.opn .s4 .imgside img:hover {
  filter: grayscale(100%)
}

.opn .s4 .clearfix::after {
  content: "";
  display: table;
  clear: both
}

.opn .s5 {
  padding-top: 64px;
  padding-bottom: 64px;
  background: #FEFEFE
}

.opn .s5 .row {
  display: flex;
  flex-direction: row;
  gap: 64px;
  align-items: flex-start
}

.opn .s5 .col {
  flex: 1 1 0
}

.opn .s5 .eyebrow {
  font-size: 13px;
  line-height: 1.35;
  color: #F67A51;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 600;
  margin-bottom: 16px
}

.opn .s5 h2 {
  font-size: clamp(23px, 3vw, 45px);
  line-height: 1.35;
  color: #065E8B;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  margin: 0 0 32px
}

.opn .s5 .para {
  font-size: 15px;
  line-height: 1.6;
  color: #3a3a3a;
  margin: 0 0 16px
}

.opn .s5 .para.narrow {
  max-width: 80%
}

.opn .s5 .imgwrap3 {
  border-radius: 2px;
  overflow: hidden;
  box-shadow: 0 8px 48px 0 #065e8b1c;
  position: relative
}

.opn .s5 .imgwrap3::before {
  content: "";
  position: absolute;
  inset: 5px;
  border: 1.5px solid #f67a5147;
  border-radius: 2px;
  z-index: 1;
  pointer-events: none
}

.opn .s5 .imgwrap3::after {
  content: "";
  position: absolute;
  inset: 9px;
  border: 1px solid #065e8b26;
  border-radius: 2px;
  z-index: 1;
  pointer-events: none
}

.opn .s5 .imgwrap3 img {
  width: 100%;
  height: 420px;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: filter .6s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.opn .s5 .imgwrap3 img:hover {
  filter: grayscale(100%)
}

.opn .s5 .stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 32px
}

.opn .s5 .stat {
  padding: 16px;
  background: #f4f0eb;
  border-radius: 2px;
  box-shadow: 0 1px 5px 0 #065e8b12;
  text-align: right
}

.opn .s5 .stat .val {
  font-size: 45px;
  line-height: 1.1;
  color: #065E8B;
  font-weight: 900;
  display: block
}

.opn .s5 .stat .lbl {
  font-size: 13px;
  line-height: 1.35;
  color: #666;
  display: block;
  margin-top: 4px
}

.opn .s6 {
  padding-top: 64px;
  padding-bottom: 64px;
  background: #f4f0eb;
  position: relative
}

.opn .s6::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 55% 60% at 50% 50%, #065e8b0a 0%, transparent 70%);
  pointer-events: none
}

.opn .s6 .eyebrow {
  font-size: 13px;
  line-height: 1.35;
  color: #F67A51;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 600;
  margin-bottom: 16px;
  text-align: right
}

.opn .s6 h2 {
  font-size: clamp(23px, 3vw, 45px);
  line-height: 1.35;
  color: #065E8B;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  margin: 0 0 32px;
  text-align: right
}

.opn .s6 .plans {
  display: flex;
  flex-direction: row;
  gap: 32px;
  margin-top: 32px
}

.opn .s6 .plan {
  flex: 1 1 0;
  padding: 32px;
  border-radius: 2px;
  background: #FEFEFE;
  box-shadow: 0 5px 28px 0 #065e8b14;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: box-shadow .6s ease, transform .5s ease
}

.opn .s6 .plans:hover .plan:not(:hover) {
  transform: scale(0.97)
}

.opn .s6 .plan:hover {
  transform: scale(1.03);
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.opn .s6 .plan h4 {
  font-size: 18px;
  line-height: 1.35;
  color: #065E8B;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  margin: 0
}

.opn .s6 .plan .price {
  font-size: 45px;
  line-height: 1.1;
  color: #065E8B;
  font-weight: 900
}

.opn .s6 .plan .price span {
  font-size: 18px;
  font-weight: 400;
  color: #888
}

.opn .s6 .plan .desc {
  font-size: 15px;
  line-height: 1.6;
  color: #3a3a3a;
  margin: 0
}

.opn .s6 .plan .items {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 8px
}

.opn .s6 .plan .item {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 8px
}

.opn .s6 .plan .item .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #F67A51;
  flex-shrink: 0;
  margin-top: 5px
}

.opn .s6 .plan .item p {
  font-size: 13px;
  line-height: 1.6;
  color: #3a3a3a;
  margin: 0
}

.opn .s6 .plan .planlink {
  display: inline-block;
  margin-top: 8px;
  font-size: 15px;
  line-height: 1.35;
  font-weight: 600;
  color: #FEFEFE;
  background: linear-gradient(135deg, #065E8B 0%, #054d74 100%);
  padding: 12px 24px;
  border-radius: 2px;
  text-decoration: none;
  background-size: 200% 200%;
  background-position: 0 0;
  transition: background-position .5s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.opn .s6 .plan .planlink:hover {
  background-position: 100% 100%
}

.opn .s6 .plan .planlink:focus {
  outline: 2px solid #F67A51;
  outline-offset: 3px
}

.opn .s6 .plan.featured {
  background: linear-gradient(168deg, #065E8B 0%, #054472 100%)
}

.opn .s6 .plan.featured h4 {
  color: #FEFEFE
}

.opn .s6 .plan.featured .price {
  color: #FEFEFE
}

.opn .s6 .plan.featured .price span {
  color: #fefefe99
}

.opn .s6 .plan.featured .desc {
  color: #fefefecc
}

.opn .s6 .plan.featured .item p {
  color: #fefefecc
}

.opn .s6 .plan.featured .planlink {
  background: linear-gradient(135deg, #F67A51 0%, #d95e34 100%);
  color: #FEFEFE
}

.opn .s6 .plan.featured .planlink:hover {
  background-position: 100% 100%
}

.opn .s6 .ring {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
  margin-bottom: 32px
}

.opn .s6 .ringwrap {
  position: relative;
  width: 80px;
  height: 80px
}

.opn .s6 .ringwrap svg {
  width: 80px;
  height: 80px;
  transform: rotate(-90deg)
}

.opn .s6 .ringwrap .ringval {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 15px;
  line-height: 1.1;
  font-weight: 700;
  color: #065E8B
}

.opn .s6 .ring .ringtext {
  font-size: 13px;
  line-height: 1.6;
  color: #3a3a3a;
  max-width: 200px;
  text-align: right
}

.opn .s7 {
  padding-top: 64px;
  padding-bottom: 64px;
  background: #FEFEFE;
  animation: breathe 7s ease infinite
}

@keyframes breathe {

  0%,
  100% {
    filter: contrast(1)
  }

  50% {
    filter: contrast(1.02)
  }
}

.opn .s7 .row {
  display: flex;
  flex-direction: row;
  gap: 64px;
  align-items: flex-start
}

.opn .s7 .col {
  flex: 1 1 0
}

.opn .s7 .eyebrow {
  font-size: 13px;
  line-height: 1.35;
  color: #F67A51;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 600;
  margin-bottom: 16px
}

.opn .s7 h2 {
  font-size: clamp(23px, 3vw, 45px);
  line-height: 1.35;
  color: #065E8B;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  margin: 0 0 32px
}

.opn .s7 .para {
  font-size: 15px;
  line-height: 1.6;
  color: #3a3a3a;
  margin: 0 0 16px
}

.opn .s7 .para.narrow {
  max-width: 80%
}

.opn .s7 .imgwrap4 {
  border-radius: 2px;
  overflow: hidden;
  box-shadow: 0 8px 48px 0 #065e8b1c;
  position: relative
}

.opn .s7 .imgwrap4::before {
  content: "";
  position: absolute;
  inset: 5px;
  border: 1.5px solid #065e8b26;
  border-radius: 2px;
  z-index: 1;
  pointer-events: none
}

.opn .s7 .imgwrap4::after {
  content: "";
  position: absolute;
  inset: 9px;
  border: 1px solid #f67a5138;
  border-radius: 2px;
  z-index: 1;
  pointer-events: none
}

.opn .s7 .imgwrap4 img {
  width: 100%;
  height: 380px;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: filter .8s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.opn .s7 .imgwrap4 img:hover {
  filter: grayscale(100%)
}

.opn .s7 .gaps {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 32px
}

.opn .s7 .gaprow {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 16px;
  padding: 16px;
  background: #f4f0eb;
  border-radius: 2px;
  box-shadow: 0 1px 5px 0 #065e8b12;
  transition: box-shadow .5s ease
}

.opn .s7 .gaprow:hover {
  box-shadow: 0 5px 28px 0 #065e8b14
}

.opn .s7 .gaprow .arrow {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  margin-top: 2px
}

.opn .s7 .gaprow p {
  font-size: 15px;
  line-height: 1.6;
  color: #3a3a3a;
  margin: 0
}

.opn .s7 .ctalink {
  display: inline-block;
  margin-top: 32px;
  font-size: 15px;
  line-height: 1.35;
  font-weight: 600;
  color: #FEFEFE;
  background: linear-gradient(135deg, #065E8B 0%, #054d74 100%);
  padding: 16px 32px;
  border-radius: 2px;
  text-decoration: none;
  background-size: 200% 200%;
  background-position: 0 0;
  transition: background-position .6s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow .6s ease;
  box-shadow: 0 5px 28px 0 #065e8b14
}

.opn .s7 .ctalink:hover {
  background-position: 100% 100%;
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.opn .s7 .ctalink:focus {
  outline: 2px solid #F67A51;
  outline-offset: 3px
}

@media (max-width: 1024px) {
  .opn .s1 .row {
    flex-direction: column;
    gap: 32px
  }

  .opn .s1 .right {
    flex: 0 0 auto;
    width: 100%
  }

  .opn .s1 .imgwrap img {
    height: 380px
  }

  .opn .s2 .row {
    flex-direction: column;
    gap: 32px
  }

  .opn .s2 .col.shifted {
    padding-top: 0
  }

  .opn .s3 .cards {
    grid-template-columns: 1fr;
    gap: 16px
  }

  .opn .s4 .imgside {
    float: none;
    width: 100%;
    margin-left: 0;
    margin-bottom: 32px
  }

  .opn .s5 .row {
    flex-direction: column;
    gap: 32px
  }

  .opn .s6 .plans {
    flex-direction: column;
    gap: 16px
  }

  .opn .s7 .row {
    flex-direction: column;
    gap: 32px
  }
}

@media (max-width: 768px) {
  .opn .pg {
    padding-left: 16px;
    padding-right: 16px
  }

  .opn .s5 .stats {
    grid-template-columns: 1fr
  }

  .opn .s4 .trail {
    padding-left: 16px
  }

  .opn .s4 .step .num {
    display: none
  }
}

@media (max-width: 480px) {
  .opn .s1 .btns {
    flex-direction: column
  }

  .opn .s6 .ring {
    flex-direction: column;
    align-items: flex-start
  }

  .opn .s6 .eyebrow,
  .opn .s6 h2 {
    text-align: left
  }
}

.srv {
  position: relative;
  overflow-x: clip
}

.srv .stripe-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 0
}

.srv .stripe-bg::before {
  content: "";
  position: absolute;
  inset: -60% -40%;
  background: repeating-linear-gradient(118deg, transparent, transparent 38px, #065e8b0a 38px, #065e8b0a 40px);
  animation: stripedrift 18s linear infinite
}

@keyframes stripedrift {
  0% {
    transform: translateX(0) translateY(0)
  }

  100% {
    transform: translateX(80px) translateY(80px)
  }
}

.srv .pg-top {
  position: relative;
  z-index: 1;
  max-width: 1500px;
  margin: 0 auto;
  padding: 64px 32px 32px;
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 64px;
  align-items: start
}

.srv .pg-top-text {
  padding: 64px 32px 64px 0
}

.srv .pg-top-label {
  font-size: 13px;
  line-height: 1.35;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #F67A51;
  margin-bottom: 16px;
  display: block
}

.srv .pg-top-h1 {
  font-size: clamp(45px, 5vw, 62px);
  line-height: 1.1;
  font-weight: 800;
  color: #065E8B;
  margin: 0 0 32px;
  text-transform: uppercase;
  letter-spacing: .03em
}

.srv .pg-top-h1 em {
  font-style: normal;
  color: #F67A51
}

.srv .pg-top-para {
  font-size: 18px;
  line-height: 1.6;
  color: #1b3a4b;
  margin: 0 0 16px;
  max-width: 560px
}

.srv .pg-top-para.narrow {
  max-width: 380px
}

.srv .pg-top-actions {
  margin-top: 32px;
  display: flex;
  flex-direction: row;
  gap: 16px;
  flex-wrap: wrap
}

.srv .btn-prim {
  display: inline-block;
  padding: 16px 32px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
  color: #FEFEFE;
  background: #065E8B;
  border: 2px solid #065E8B;
  border-radius: 2px;
  cursor: pointer;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  transition: color .6s cubic-bezier(0.25, 0.46, 0.45, 0.94), border-color .5s ease
}

.srv .btn-prim::before {
  content: "";
  position: absolute;
  inset: 0;
  background: #F67A51;
  transform: translateX(-101%) skewX(-12deg);
  transition: transform .55s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  z-index: 0
}

.srv .btn-prim:hover::before {
  transform: translateX(0) skewX(-12deg)
}

.srv .btn-prim:hover {
  border-color: #F67A51;
  color: #FEFEFE
}

.srv .btn-prim span {
  position: relative;
  z-index: 1
}

.srv .btn-sec {
  display: inline-block;
  padding: 16px 32px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
  color: #065E8B;
  background: transparent;
  border: 2px solid #065E8B;
  border-radius: 2px;
  cursor: pointer;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  transition: color .7s ease, border-color .5s ease
}

.srv .btn-sec::before {
  content: "";
  position: absolute;
  inset: 0;
  background: #065E8B;
  transform: translateX(-101%) skewX(-12deg);
  transition: transform .6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  z-index: 0
}

.srv .btn-sec:hover::before {
  transform: translateX(0) skewX(-12deg)
}

.srv .btn-sec:hover {
  color: #FEFEFE;
  border-color: #065E8B
}

.srv .btn-sec span {
  position: relative;
  z-index: 1
}

.srv .pg-top-img-col {
  position: relative;
  padding-top: 32px
}

.srv .img-bracket {
  position: relative;
  display: inline-block
}

.srv .img-bracket::before,
.srv .img-bracket::after {
  content: "";
  position: absolute;
  width: 28px;
  height: 28px;
  border-color: #F67A51;
  border-style: solid;
  z-index: 2
}

.srv .img-bracket::before {
  top: -8px;
  left: -8px;
  border-width: 3px 0 0 3px
}

.srv .img-bracket::after {
  bottom: -8px;
  right: -8px;
  border-width: 0 3px 3px 0
}

.srv .img-bracket img {
  display: block;
  width: 100%;
  height: 420px;
  object-fit: cover;
  object-position: center;
  border-radius: 2px;
  filter: saturate(0.7) blur(0px);
  transition: filter .7s ease;
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.srv .img-bracket img:hover {
  filter: saturate(1) blur(0px)
}

.srv .img-bracket .blur-fore {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 120px;
  background: linear-gradient(to top, #065e8b2e, transparent);
  border-radius: 0 0 2px 2px;
  pointer-events: none
}

.srv .divider-arrows {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 16px 0;
  position: relative;
  z-index: 1
}

.srv .divider-arrows .arr {
  width: 10px;
  height: 10px;
  border-right: 2px solid #065e8b4d;
  border-bottom: 2px solid #065e8b4d;
  transform: rotate(-45deg)
}

.srv .divider-arrows .arr.accent {
  border-color: #F67A51
}

.srv .svc-list {
  position: relative;
  z-index: 1;
  background: linear-gradient(160deg, #065e8b0f 0%, #fefefe00 50%, #f67a510d 100%);
  padding: 64px 0
}

.srv .svc-list-inner {
  max-width: 1500px;
  margin: 0 auto;
  padding: 0 32px
}

.srv .svc-list-head {
  margin-bottom: 64px
}

.srv .svc-list-head h2 {
  font-size: clamp(23px, 3vw, 45px);
  line-height: 1.1;
  font-weight: 800;
  color: #065E8B;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin: 0 0 16px
}

.srv .svc-list-head p {
  font-size: 18px;
  line-height: 1.6;
  color: #1b3a4b;
  max-width: 520px;
  margin: 0
}

.srv .svc-rows {
  display: flex;
  flex-direction: column;
  gap: 32px
}

.srv .svc-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: center;
  padding: 32px;
  border-radius: 2px;
  box-shadow: 0 5px 28px 0 #065e8b14;
  background: #FEFEFE;
  transition: box-shadow .6s ease
}

.srv .svc-row:hover {
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.srv .svc-row.flip {
  direction: ltr
}

.srv .svc-row.flip .svc-row-img {
  order: 2
}

.srv .svc-row.flip .svc-row-body {
  order: 1;
  text-align: right
}

.srv .svc-row-img img {
  display: block;
  width: 100%;
  height: 280px;
  object-fit: cover;
  object-position: center;
  border-radius: 2px;
  filter: saturate(0.75);
  transition: filter .65s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.srv .svc-row-img img:hover {
  filter: saturate(1)
}

.srv .svc-row-body h3 {
  font-size: 23px;
  line-height: 1.35;
  font-weight: 800;
  color: #065E8B;
  text-transform: uppercase;
  letter-spacing: .05em;
  margin: 0 0 16px
}

.srv .svc-row-body p {
  font-size: 15px;
  line-height: 1.6;
  color: #1b3a4b;
  margin: 0 0 16px
}

.srv .svc-row-body p.narrow {
  max-width: 340px
}

.srv .svc-row.flip .svc-row-body p.narrow {
  margin-left: auto
}

.srv .svc-tag-list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px
}

.srv .svc-row.flip .svc-tag-list {
  justify-content: flex-end
}

.srv .svc-tag {
  font-size: 13px;
  line-height: 1.35;
  font-weight: 600;
  color: #065E8B;
  background: #065e8b14;
  border-radius: 2px;
  padding: 4px 8px;
  display: inline-block
}

.srv .divider-arrows2 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 16px 0;
  position: relative;
  z-index: 1
}

.srv .divider-arrows2 .arr2 {
  width: 12px;
  height: 12px;
  border-right: 2px solid #f67a5166;
  border-bottom: 2px solid #f67a5166;
  transform: rotate(-45deg)
}

.srv .divider-arrows2 .arr2.mid {
  border-color: #065E8B;
  width: 14px;
  height: 14px
}

.srv .formats {
  position: relative;
  z-index: 1;
  padding: 64px 0;
  background: #065E8B
}

.srv .formats-inner {
  max-width: 1500px;
  margin: 0 auto;
  padding: 0 32px
}

.srv .formats-head {
  margin-bottom: 64px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
  gap: 32px
}

.srv .formats-head h2 {
  font-size: clamp(23px, 3vw, 45px);
  line-height: 1.1;
  font-weight: 800;
  color: #FEFEFE;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin: 0
}

.srv .formats-head p {
  font-size: 15px;
  line-height: 1.6;
  color: #fefefebf;
  max-width: 360px;
  margin: 0;
  text-align: right
}

.srv .formats-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px
}

.srv .fmt-card {
  background: #fefefe12;
  border: 1px solid #fefefe1f;
  border-radius: 2px;
  padding: 32px;
  transition: background .6s ease, border-color .5s ease
}

.srv .fmt-card:hover {
  background: #fefefe21;
  border-color: #f67a5180
}

.srv .fmt-icon {
  width: 40px;
  height: 40px;
  margin-bottom: 16px
}

.srv .fmt-icon svg {
  width: 40px;
  height: 40px
}

.srv .fmt-card h4 {
  font-size: 18px;
  line-height: 1.35;
  font-weight: 800;
  color: #FEFEFE;
  text-transform: uppercase;
  letter-spacing: .05em;
  margin: 0 0 16px
}

.srv .fmt-card p {
  font-size: 15px;
  line-height: 1.6;
  color: #fefefec7;
  margin: 0 0 16px
}

.srv .fmt-detail {
  font-size: 13px;
  line-height: 1.8;
  color: #F67A51;
  font-weight: 600;
  display: block
}

.srv .fmt-steps {
  margin-top: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px
}

.srv .fmt-step {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 8px
}

.srv .fmt-step-dot {
  width: 8px;
  height: 8px;
  border-radius: 40px;
  background: #F67A51;
  margin-top: 6px;
  flex-shrink: 0;
  position: relative
}

.srv .fmt-step-dot::after {
  content: "";
  position: absolute;
  left: 3px;
  top: 8px;
  width: 2px;
  height: 16px;
  background: #f67a514d
}

.srv .fmt-step:last-child .fmt-step-dot::after {
  display: none
}

.srv .fmt-step-text {
  font-size: 13px;
  line-height: 1.6;
  color: #fefefeb3
}

.srv .divider-arrows3 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 16px 0;
  position: relative;
  z-index: 1;
  background: #065E8B
}

.srv .divider-arrows3 .arr3 {
  width: 10px;
  height: 10px;
  border-right: 2px solid #fefefe40;
  border-bottom: 2px solid #fefefe40;
  transform: rotate(-45deg)
}

.srv .divider-arrows3 .arr3.lit {
  border-color: #f67a51b3
}

.srv .expert {
  position: relative;
  z-index: 1;
  padding: 64px 0;
  background: linear-gradient(170deg, #fefefeff 0%, #065e8b0d 100%)
}

.srv .expert-inner {
  max-width: 1500px;
  margin: 0 auto;
  padding: 0 32px;
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 64px;
  align-items: start
}

.srv .expert-portrait {
  position: relative
}

.srv .expert-portrait-img {
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  object-position: center;
  border-radius: 40px;
  filter: saturate(0.72);
  transition: filter .7s ease;
  box-shadow: 0 8px 48px 0 #065e8b1c;
  display: block
}

.srv .expert-portrait-img:hover {
  filter: saturate(1)
}

.srv .expert-badge {
  position: absolute;
  bottom: -16px;
  right: -16px;
  background: #F67A51;
  color: #FEFEFE;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  padding: 8px 16px;
  border-radius: 2px;
  box-shadow: 0 5px 28px 0 #065e8b14
}

.srv .expert-body {
  padding-top: 16px
}

.srv .expert-body h2 {
  font-size: clamp(23px, 2.5vw, 45px);
  line-height: 1.1;
  font-weight: 800;
  color: #065E8B;
  text-transform: uppercase;
  letter-spacing: .05em;
  margin: 0 0 16px
}

.srv .expert-body h5 {
  font-size: 13px;
  line-height: 1.35;
  font-weight: 700;
  color: #F67A51;
  text-transform: uppercase;
  letter-spacing: .1em;
  margin: 0 0 32px
}

.srv .expert-body p {
  font-size: 15px;
  line-height: 1.6;
  color: #1b3a4b;
  margin: 0 0 16px;
  max-width: 600px
}

.srv .expert-body p.narrow {
  max-width: 400px
}

.srv .expert-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 32px
}

.srv .metric-box {
  background: #FEFEFE;
  border-radius: 2px;
  padding: 16px;
  box-shadow: 0 1px 5px 0 #065e8b12;
  border-top: 2px solid #065E8B
}

.srv .metric-val {
  font-size: 45px;
  line-height: 1.1;
  font-weight: 800;
  color: #065E8B;
  display: block
}

.srv .metric-label {
  font-size: 13px;
  line-height: 1.35;
  color: #1b3a4b;
  display: block;
  margin-top: 4px
}

.srv .expert-cta {
  margin-top: 32px;
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: center;
  flex-wrap: wrap
}

.srv .type-reveal {
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  border-right: 2px solid #F67A51;
  animation: typeout 2.2s steps(30, end) .4s both, blinkcaret .8s step-end 2.6s infinite;
  max-width: 100%
}

@keyframes typeout {
  from {
    width: 0
  }

  to {
    width: 100%
  }
}

@keyframes blinkcaret {

  0%,
  100% {
    border-color: #F67A51
  }

  50% {
    border-color: transparent
  }
}

@media (max-width: 1024px) {
  .srv .pg-top {
    grid-template-columns: 1fr 260px;
    gap: 32px
  }

  .srv .svc-row {
    grid-template-columns: 1fr 1fr
  }

  .srv .formats-grid {
    grid-template-columns: 1fr 1fr
  }

  .srv .expert-inner {
    grid-template-columns: 220px 1fr;
    gap: 32px
  }

  .srv .expert-metrics {
    grid-template-columns: repeat(3, 1fr)
  }
}

@media (max-width: 768px) {
  .srv .pg-top {
    grid-template-columns: 1fr;
    padding: 32px 16px 16px
  }

  .srv .pg-top-img-col {
    display: none
  }

  .srv .pg-top-text {
    padding: 32px 0
  }

  .srv .svc-list-inner {
    padding: 0 16px
  }

  .srv .svc-row {
    grid-template-columns: 1fr
  }

  .srv .svc-row.flip .svc-row-img {
    order: 0
  }

  .srv .svc-row.flip .svc-row-body {
    order: 1;
    text-align: left
  }

  .srv .svc-row.flip .svc-tag-list {
    justify-content: flex-start
  }

  .srv .svc-row.flip .svc-row-body p.narrow {
    margin-left: 0
  }

  .srv .formats-inner {
    padding: 0 16px
  }

  .srv .formats-head {
    flex-direction: column;
    align-items: flex-start
  }

  .srv .formats-head p {
    text-align: left
  }

  .srv .formats-grid {
    grid-template-columns: 1fr
  }

  .srv .expert-inner {
    grid-template-columns: 1fr;
    padding: 0 16px
  }

  .srv .expert-portrait {
    max-width: 220px
  }

  .srv .expert-metrics {
    grid-template-columns: 1fr 1fr
  }
}

@media (max-width: 480px) {
  .srv .pg-top-h1 {
    font-size: 45px
  }

  .srv .expert-metrics {
    grid-template-columns: 1fr
  }

  .srv .metric-val {
    font-size: 45px
  }
}

.ctus {
  position: relative;
  overflow: hidden
}

.ctus .pg-wrap {
  max-width: 1500px;
  margin: 0 auto;
  padding: 0 32px
}

.ctus .reach-band {
  padding: 64px 0;
  background: #FEFEFE;
  position: relative
}

.ctus .reach-band::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, #065E8B22, #065E8B44, #065E8B22, transparent)
}

.ctus .reach-inner {
  display: flex;
  flex-direction: row;
  gap: 64px;
  align-items: flex-start
}

.ctus .reach-left {
  flex: 0 0 420px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  position: relative
}

.ctus .reach-img-wrap {
  position: relative;
  border-radius: 2px;
  overflow: hidden;
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.ctus .reach-img-wrap img {
  width: 100%;
  height: 280px;
  object-fit: cover;
  display: block;
  transition: filter .6s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.ctus .reach-img-wrap img:hover {
  filter: saturate(0)
}

.ctus .reach-img-wrap::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, #065e8b2e 0%, transparent 60%);
  z-index: 1;
  pointer-events: none
}

.ctus .dbl-border {
  position: absolute;
  top: -8px;
  left: -8px;
  right: 8px;
  bottom: 8px;
  border: 1px solid #065e8b2e;
  border-radius: 2px;
  pointer-events: none
}

.ctus .dbl-border-outer {
  position: absolute;
  top: -16px;
  left: -16px;
  right: 16px;
  bottom: 16px;
  border: 1px solid #065e8b17;
  border-radius: 2px;
  pointer-events: none
}

.ctus .curl-deco {
  position: absolute;
  bottom: -32px;
  left: -16px;
  width: 80px;
  height: 80px;
  opacity: .08;
  pointer-events: none
}

.ctus .info-cards {
  display: flex;
  flex-direction: column;
  gap: 16px
}

.ctus .icard {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 16px;
  padding: 16px;
  border-radius: 2px;
  background: #FEFEFE;
  box-shadow: 0 1px 5px 0 #065e8b12;
  transition: box-shadow .5s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.ctus .icard:hover {
  box-shadow: 0 5px 28px 0 #065e8b14
}

.ctus .icard-icon {
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  border-radius: 2px;
  background: #065E8B;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 5px 28px 0 #065e8b14;
  animation: floatup 3s ease-in-out infinite
}

@keyframes floatup {

  0%,
  100% {
    transform: translateY(0)
  }

  50% {
    transform: translateY(-4px)
  }
}

.ctus .icard-icon svg {
  width: 20px;
  height: 20px;
  fill: #FEFEFE
}

.ctus .icard-body {
  flex: 1
}

.ctus .icard-label {
  font-size: 13px;
  line-height: 1.35;
  color: #065E8B;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom: 4px
}

.ctus .icard-val {
  font-size: 15px;
  line-height: 1.6;
  color: #1a3a4a
}

.ctus .icard-val a {
  color: #065E8B;
  text-decoration: none;
  transition: color .5s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.ctus .icard-val a:hover {
  color: #F67A51
}

.ctus .locale-flag {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  background: linear-gradient(135deg, #065E8B11 0%, #065E8B05 100%);
  border-radius: 2px;
  font-size: 13px;
  line-height: 1.35;
  color: #065E8B
}

.ctus .reach-right {
  flex: 1;
  min-width: 0
}

.ctus .form-head {
  margin-bottom: 32px
}

.ctus .form-label-top {
  font-size: 13px;
  line-height: 1.35;
  color: #F67A51;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  margin-bottom: 8px
}

.ctus .form-title {
  font-size: 45px;
  line-height: 1.1;
  color: #065E8B;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-bottom: 16px
}

.ctus .form-desc {
  font-size: 15px;
  line-height: 1.6;
  color: #2a4a5a;
  max-width: 480px
}

.ctus .form-desc.narrow {
  max-width: 340px
}

.ctus .contact-form {
  display: flex;
  flex-direction: column;
  gap: 16px
}

.ctus .frow {
  display: flex;
  flex-direction: row;
  gap: 16px
}

.ctus .fgroup {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1
}

.ctus .fgroup.full {
  flex: 1 1 100%
}

.ctus .flabel {
  font-size: 13px;
  line-height: 1.35;
  color: #065E8B;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em
}

.ctus .finput {
  padding: 16px;
  border: 1px solid #065e8b33;
  border-radius: 2px;
  font-size: 15px;
  line-height: 1.6;
  color: #1a3a4a;
  background: #FEFEFE;
  outline: none;
  transition: border-color .5s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow .5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  box-shadow: inset 0 2px 6px 0 #065e8b0a;
  width: 100%;
  box-sizing: border-box
}

.ctus .finput::placeholder {
  font-size: 13px;
  color: #7a9aaa
}

.ctus .finput:focus {
  border-color: #065E8B;
  box-shadow: inset 0 2px 6px 0 #065e8b12 0 0 0 3px #065e8b14
}

.ctus .fselect {
  padding: 16px;
  border: 1px solid #065e8b33;
  border-radius: 2px;
  font-size: 15px;
  line-height: 1.6;
  color: #1a3a4a;
  background: #FEFEFE;
  outline: none;
  transition: border-color .5s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow .5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  box-shadow: inset 0 2px 6px 0 #065e8b0a;
  width: 100%;
  box-sizing: border-box;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%23065E8B' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  padding-right: 40px
}

.ctus .fselect:focus {
  border-color: #065E8B;
  box-shadow: inset 0 2px 6px 0 #065e8b12 0 0 0 3px #065e8b14
}

.ctus .ftextarea {
  padding: 16px;
  border: 1px solid #065e8b33;
  border-radius: 2px;
  font-size: 15px;
  line-height: 1.6;
  color: #1a3a4a;
  background: #FEFEFE;
  outline: none;
  transition: border-color .5s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow .5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  box-shadow: inset 0 2px 6px 0 #065e8b0a;
  width: 100%;
  box-sizing: border-box;
  resize: vertical;
  min-height: 120px
}

.ctus .ftextarea::placeholder {
  font-size: 13px;
  color: #7a9aaa
}

.ctus .ftextarea:focus {
  border-color: #065E8B;
  box-shadow: inset 0 2px 6px 0 #065e8b12 0 0 0 3px #065e8b14
}

.ctus .privacy-row {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 12px;
  padding: 16px;
  background: linear-gradient(135deg, #065E8B08 0%, transparent 100%);
  border-radius: 2px
}

.ctus .privacy-row .pretty {
  margin: 0;
  flex-shrink: 0;
  margin-top: 2px
}

.ctus .privacy-text {
  font-size: 13px;
  line-height: 1.6;
  color: #2a4a5a
}

.ctus .privacy-text a {
  color: #065E8B;
  text-decoration: none;
  font-weight: 600;
  transition: color .5s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.ctus .privacy-text a:hover {
  color: #F67A51
}

.ctus .submit-btn {
  align-self: flex-start;
  padding: 16px 32px;
  background: #065E8B;
  color: #FEFEFE;
  font-size: 15px;
  line-height: 1.35;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  border: none;
  border-radius: 40px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: color .6s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow .6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  box-shadow: 0 5px 28px 0 #065e8b14
}

.ctus .submit-btn::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #054d73 0%, #043d5c 100%);
  transition: left .6s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.ctus .submit-btn:hover::before {
  left: 0
}

.ctus .submit-btn:hover {
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.ctus .submit-btn span {
  position: relative;
  z-index: 1
}

.ctus .submit-btn:focus {
  outline: 2px solid #F67A51;
  outline-offset: 3px
}

.ctus .submit-btn:active {
  transform: translateY(1px)
}

.ctus .divider-wave {
  position: relative;
  height: 32px;
  overflow: hidden
}

.ctus .divider-wave svg {
  position: absolute;
  width: 100%;
  left: 0
}

.ctus .divider-wave svg:first-child {
  top: 0
}

.ctus .divider-wave svg:last-child {
  top: 12px
}

.ctus .extra-band {
  padding: 64px 0;
  background: linear-gradient(160deg, #065E8B 0%, #043d5c 100%);
  position: relative
}

.ctus .extra-inner {
  display: flex;
  flex-direction: row;
  gap: 64px;
  align-items: flex-start
}

.ctus .extra-col-a {
  flex: 0 0 380px;
  display: flex;
  flex-direction: column;
  gap: 16px
}

.ctus .extra-col-b {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 32px;
  margin-top: 32px
}

.ctus .extra-eyebrow {
  font-size: 13px;
  line-height: 1.35;
  color: #F67A51;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em
}

.ctus .extra-heading {
  font-size: 45px;
  line-height: 1.1;
  color: #FEFEFE;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em
}

.ctus .extra-body {
  font-size: 15px;
  line-height: 1.6;
  color: #fefefec7
}

.ctus .extra-body.narrow {
  max-width: 320px
}

.ctus .hours-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 16px
}

.ctus .hrow {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 8px 16px;
  border-radius: 2px;
  background: #fefefe12;
  font-size: 15px;
  line-height: 1.35;
  color: #FEFEFE;
  transition: background .5s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.ctus .hrow:hover {
  background: #fefefe21
}

.ctus .hrow-day {
  font-weight: 600;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: #fefefeb3
}

.ctus .hrow-time {
  color: #F67A51;
  font-weight: 600
}

.ctus .dot-trail {
  display: flex;
  flex-direction: column;
  gap: 0
}

.ctus .dt-item {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 16px
}

.ctus .dt-marker {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 0 0 20px
}

.ctus .dt-dot {
  width: 12px;
  height: 12px;
  border-radius: 40px;
  background: #F67A51;
  flex-shrink: 0;
  margin-top: 4px;
  box-shadow: 0 1px 5px 0 #065e8b12
}

.ctus .dt-dot.dim {
  background: #fefefe40
}

.ctus .dt-line {
  flex: 1;
  width: 1px;
  background: #fefefe26;
  min-height: 32px
}

.ctus .dt-body {
  flex: 1;
  padding-bottom: 32px
}

.ctus .dt-label {
  font-size: 13px;
  line-height: 1.35;
  color: #F67A51;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom: 4px
}

.ctus .dt-text {
  font-size: 15px;
  line-height: 1.6;
  color: #fefefec7
}

.ctus .extra-band .curl-deco {
  position: absolute;
  top: 32px;
  right: 32px;
  width: 100px;
  height: 100px;
  opacity: .06;
  pointer-events: none;
  bottom: auto;
  left: auto
}

@media (max-width: 1024px) {
  .ctus .reach-inner {
    flex-direction: column;
    gap: 32px
  }

  .ctus .reach-left {
    flex: none;
    width: 100%
  }

  .ctus .reach-img-wrap img {
    height: 220px
  }

  .ctus .extra-inner {
    flex-direction: column;
    gap: 32px
  }

  .ctus .extra-col-a {
    flex: none;
    width: 100%
  }

  .ctus .extra-col-b {
    margin-top: 0
  }

  .ctus .form-title {
    font-size: 45px
  }
}

@media (max-width: 768px) {
  .ctus .reach-band {
    padding: 32px 0
  }

  .ctus .extra-band {
    padding: 32px 0
  }

  .ctus .pg-wrap {
    padding: 0 16px
  }

  .ctus .frow {
    flex-direction: column;
    gap: 16px
  }

  .ctus .form-title {
    font-size: 23px
  }

  .ctus .extra-heading {
    font-size: 23px
  }

  .ctus .submit-btn {
    width: 100%;
    text-align: center
  }

  .ctus .reach-inner {
    gap: 32px
  }
}

@media (max-width: 480px) {
  .ctus .pg-wrap {
    padding: 0 16px
  }

  .ctus .form-title {
    font-size: 23px
  }

  .ctus .icard-val {
    font-size: 13px
  }
}

.successPage {
  min-height: 80vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 64px 32px;
  background: #FEFEFE
}

.successPage .wrap {
  max-width: 580px;
  width: 100%;
  text-align: center
}

.successPage .iconRing {
  width: 80px;
  height: 80px;
  border-radius: 40px;
  background: linear-gradient(160deg, #065E8B 0%, #0a8fd4 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 32px;
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.successPage .iconRing svg {
  display: block
}

.successPage .heading {
  font-size: 45px;
  line-height: 1.1;
  font-weight: 700;
  color: #065E8B;
  letter-spacing: 0;
  margin: 0 0 16px;
  text-transform: uppercase
}

.successPage .sub {
  font-size: 18px;
  line-height: 1.6;
  color: #2a4a58;
  margin: 0 0 32px
}

.successPage .divLine {
  width: 48px;
  height: 2px;
  background: #F67A51;
  border-radius: 2px;
  margin: 0 auto 32px
}

.successPage .note {
  font-size: 15px;
  line-height: 1.8;
  color: #4a6b7a;
  margin: 0 0 32px
}

.successPage .note strong {
  color: #065E8B;
  font-weight: 600
}

.successPage .actions {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap
}

.successPage .btnPrimary {
  display: inline-block;
  padding: 16px 32px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  color: #FEFEFE;
  background: #065E8B;
  border-radius: 2px;
  border: none;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 5px 28px 0 #065e8b14;
  background-image: linear-gradient(135deg, #065E8B 0%, #065E8B 50%, #054f77 50%, #054f77 100%);
  background-size: 250% 250%;
  background-position: 0 0;
  transition: background-position .6s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow .5s ease
}

.successPage .btnPrimary:hover {
  background-position: 100% 100%;
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.successPage .btnPrimary:focus {
  outline: 2px solid #F67A51;
  outline-offset: 3px
}

.successPage .btnSecondary {
  display: inline-block;
  padding: 16px 32px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  color: #065E8B;
  background: #FEFEFE;
  border-radius: 2px;
  border: 1px solid #065E8B;
  cursor: pointer;
  text-decoration: none;
  background-image: linear-gradient(135deg, #FEFEFE 0%, #FEFEFE 50%, #e8f4fb 50%, #e8f4fb 100%);
  background-size: 250% 250%;
  background-position: 0 0;
  transition: background-position .7s cubic-bezier(0.25, 0.46, 0.45, 0.94), color .5s ease
}

.successPage .btnSecondary:hover {
  background-position: 100% 100%
}

.successPage .btnSecondary:focus {
  outline: 2px solid #F67A51;
  outline-offset: 3px
}

.successPage .tagline {
  margin-top: 64px;
  font-size: 13px;
  line-height: 1.6;
  color: #7a9aaa
}

.successPage .tagline a {
  color: #065E8B;
  text-decoration: none;
  transition: color .5s ease
}

.successPage .tagline a:hover {
  color: #F67A51
}

@media (max-width: 480px) {
  .successPage {
    padding: 64px 16px
  }

  .successPage .heading {
    font-size: 23px
  }

  .successPage .sub {
    font-size: 15px
  }

  .successPage .actions {
    flex-direction: column;
    gap: 8px
  }

  .successPage .btnPrimary,
  .successPage .btnSecondary {
    width: 100%;
    text-align: center
  }
}

.aboutus {
  max-width: 1500px;
  margin: 0 auto;
  overflow-x: clip
}

.aboutus .seg {
  position: relative
}

.aboutus .seg-top {
  padding: 64px 64px 32px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: end;
  min-height: 520px
}

.aboutus .seg-top::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(0deg, #FEFEFE 0%, #d6eaf5 60%, #065E8B 100%);
  animation: warmcool 8s ease-in-out infinite alternate;
  z-index: 0
}

@keyframes warmcool {
  0% {
    background: linear-gradient(0deg, #FEFEFE 0%, #d6eaf5 60%, #065E8B 100%)
  }

  50% {
    background: linear-gradient(0deg, #fff5f2 0%, #f0d8ce 60%, #8B3A06 100%)
  }

  100% {
    background: linear-gradient(0deg, #FEFEFE 0%, #d6eaf5 60%, #065E8B 100%)
  }
}

.aboutus .seg-top .corner-tl {
  position: absolute;
  top: 24px;
  left: 24px;
  width: 48px;
  height: 48px;
  border-top: 1.5px solid #065e8b59;
  border-right: none;
  border-bottom: none;
  border-left: 1.5px solid #065e8b59;
  z-index: 1;
  pointer-events: none
}

.aboutus .seg-top .corner-br {
  position: absolute;
  bottom: 40px;
  right: 24px;
  width: 48px;
  height: 48px;
  border-top: none;
  border-right: 1.5px solid #f67a5166;
  border-bottom: 1.5px solid #f67a5166;
  border-left: none;
  z-index: 1;
  pointer-events: none
}

.aboutus .seg-top .geo-pulse {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 320px;
  height: 320px;
  border: 1px solid #065e8b14;
  border-radius: 2px;
  animation: geopulse 5s steps(6) infinite;
  z-index: 0;
  pointer-events: none
}

.aboutus .seg-top .geo-pulse2 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 480px;
  height: 480px;
  border: 1px solid #065e8b0d;
  border-radius: 2px;
  animation: geopulse 5s steps(6) infinite reverse;
  z-index: 0;
  pointer-events: none
}

@keyframes geopulse {
  0% {
    opacity: .3
  }

  50% {
    opacity: 1
  }

  100% {
    opacity: .3
  }
}

.aboutus .seg-top .txt-col {
  position: relative;
  z-index: 2;
  padding-bottom: 32px
}

.aboutus .seg-top .eyebrow {
  display: inline-block;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #F67A51;
  margin-bottom: 16px
}

.aboutus .seg-top .bigtitle {
  font-size: clamp(45px, 5vw, 62px);
  line-height: 1.1;
  font-weight: 800;
  color: #FEFEFE;
  margin: 0 0 32px
}

.aboutus .seg-top .bigtitle span {
  color: #F67A51
}

.aboutus .seg-top .desc {
  font-size: 18px;
  line-height: 1.6;
  color: #fefefee0;
  max-width: 480px
}

.aboutus .seg-top .img-col {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end
}

.aboutus .seg-top .img-col .imgwrap {
  width: 100%;
  max-width: 520px;
  height: 360px;
  overflow: hidden;
  border-radius: 2px;
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.aboutus .seg-top .img-col .imgwrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: filter .7s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.aboutus .seg-top .img-col .imgwrap:hover img {
  filter: saturate(0)
}

.aboutus .divline {
  width: 40%;
  height: 1px;
  background: linear-gradient(90deg, #065e8b4d 0%, transparent 100%);
  margin: 0 64px
}

.aboutus .seg-detail {
  padding: 64px;
  background: #FEFEFE;
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 64px;
  align-items: start
}

.aboutus .seg-detail .left-col {
  display: flex;
  flex-direction: column;
  gap: 32px
}

.aboutus .seg-detail .stat-row {
  display: flex;
  flex-direction: column;
  gap: 16px
}

.aboutus .seg-detail .stat-item {
  padding: 16px;
  border-radius: 2px;
  background: #FEFEFE;
  box-shadow: 0 5px 28px 0 #065e8b14;
  transition: box-shadow .6s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.aboutus .seg-detail .stat-item:hover {
  box-shadow: 0 8px 48px 0 #065e8b1c
}

.aboutus .seg-detail .stat-num {
  font-size: 45px;
  font-weight: 800;
  line-height: 1.1;
  color: #065E8B
}

.aboutus .seg-detail .stat-label {
  font-size: 13px;
  line-height: 1.6;
  color: #444;
  margin-top: 4px
}

.aboutus .seg-detail .portrait-wrap {
  width: 100%;
  border-radius: 2px;
  overflow: hidden;
  box-shadow: 0 5px 28px 0 #065e8b14
}

.aboutus .seg-detail .portrait-wrap img {
  width: 100%;
  aspect-ratio: 2/3;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: filter .7s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.aboutus .seg-detail .portrait-wrap:hover img {
  filter: saturate(0)
}

.aboutus .seg-detail .person-name {
  font-size: 15px;
  font-weight: 700;
  color: #065E8B;
  margin-top: 8px;
  text-align: right
}

.aboutus .seg-detail .person-role {
  font-size: 13px;
  color: #555;
  text-align: right
}

.aboutus .seg-detail .right-col {
  display: flex;
  flex-direction: column;
  gap: 32px
}

.aboutus .seg-detail .block-label {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #F67A51;
  margin-bottom: 8px
}

.aboutus .seg-detail .block-head {
  font-size: 23px;
  font-weight: 800;
  line-height: 1.35;
  color: #065E8B;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin: 0 0 16px
}

.aboutus .seg-detail .para wide {
  font-size: 18px;
  line-height: 1.6;
  color: #222
}

.aboutus .seg-detail .para {
  font-size: 18px;
  line-height: 1.6;
  color: #222;
  margin: 0 0 16px
}

.aboutus .seg-detail .para.narrow {
  max-width: 420px;
  font-size: 15px;
  line-height: 1.8;
  color: #333
}

.aboutus .seg-detail .trail {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px;
  background: linear-gradient(180deg, #065e8b0a 0%, #065e8b03 100%);
  border-radius: 2px;
  box-shadow: inset 0 3px 6px 0 #065e8b12
}

.aboutus .seg-detail .trail-item {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 16px;
  position: relative
}

.aboutus .seg-detail .trail-dot {
  width: 12px;
  height: 12px;
  border-radius: 40px;
  background: #065E8B;
  flex-shrink: 0;
  margin-top: 5px;
  position: relative;
  z-index: 1
}

.aboutus .seg-detail .trail-item.active .trail-dot {
  background: #F67A51;
  box-shadow: 0 1px 5px 0 #f67a5159
}

.aboutus .seg-detail .trail-connector {
  position: absolute;
  left: 5px;
  top: 17px;
  width: 2px;
  height: calc(100% + 8px);
  background: #065e8b2e
}

.aboutus .seg-detail .trail-item:last-child .trail-connector {
  display: none
}

.aboutus .seg-detail .trail-text {
  font-size: 15px;
  line-height: 1.6;
  color: #333
}

.aboutus .seg-detail .trail-item.active .trail-text {
  color: #065E8B;
  font-weight: 600
}

.aboutus .seg-detail .imgband {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px
}

.aboutus .seg-detail .imgband .bimg {
  overflow: hidden;
  border-radius: 2px;
  height: 200px;
  box-shadow: 0 5px 28px 0 #065e8b14
}

.aboutus .seg-detail .imgband .bimg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: filter .6s ease
}

.aboutus .seg-detail .imgband .bimg:hover img {
  filter: saturate(0)
}

.aboutus .seg-detail .cta-row {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: center;
  flex-wrap: wrap
}

.aboutus .seg-detail .btn-primary {
  display: inline-block;
  padding: 16px 32px;
  font-size: 15px;
  font-weight: 700;
  color: #FEFEFE;
  background: #065E8B;
  border-radius: 2px;
  border: none;
  cursor: pointer;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  transition: color .5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  box-shadow: 0 5px 28px 0 #065e8b14
}

.aboutus .seg-detail .btn-primary::before {
  content: "";
  position: absolute;
  top: -10px;
  left: -10px;
  width: 0;
  height: 200%;
  background: #054d73;
  transform: skewX(-15deg);
  transition: width .6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  z-index: 0
}

.aboutus .seg-detail .btn-primary:hover::before {
  width: 160%
}

.aboutus .seg-detail .btn-primary span {
  position: relative;
  z-index: 1
}

.aboutus .seg-detail .btn-secondary {
  display: inline-block;
  padding: 16px 32px;
  font-size: 15px;
  font-weight: 700;
  color: #065E8B;
  background: transparent;
  border-radius: 2px;
  border: 1.5px solid #065E8B !important;
  cursor: pointer;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  transition: color .5s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

.aboutus .seg-detail .btn-secondary::before {
  content: "";
  position: absolute;
  top: -10px;
  left: -10px;
  width: 0;
  height: 200%;
  background: #065e8b14;
  transform: skewX(-15deg);
  transition: width .6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  z-index: 0
}

.aboutus .seg-detail .btn-secondary:hover::before {
  width: 160%
}

.aboutus .seg-detail .btn-secondary span {
  position: relative;
  z-index: 1
}

.aboutus .seg-detail .divline-right {
  width: 30%;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, #f67a5166 100%);
  margin-left: auto
}

@media (max-width: 1024px) {
  .aboutus .seg-top {
    grid-template-columns: 1fr;
    padding: 64px 32px 32px;
    gap: 32px
  }

  .aboutus .seg-top .img-col {
    justify-content: flex-start
  }

  .aboutus .seg-top .img-col .imgwrap {
    max-width: 100%;
    height: 280px
  }

  .aboutus .seg-detail {
    grid-template-columns: 1fr;
    padding: 64px 32px;
    gap: 32px
  }

  .aboutus .seg-detail .imgband {
    grid-template-columns: 1fr
  }

  .aboutus .divline {
    margin: 0 32px
  }
}

@media (max-width: 768px) {
  .aboutus .seg-top {
    padding: 32px 16px 16px
  }

  .aboutus .seg-top .bigtitle {
    font-size: 45px
  }

  .aboutus .seg-detail {
    padding: 32px 16px
  }

  .aboutus .divline {
    margin: 0 16px
  }

  .aboutus .seg-detail .cta-row {
    flex-direction: column;
    align-items: flex-start
  }
}

@media (max-width: 480px) {
  .aboutus .seg-top .bigtitle {
    font-size: 45px
  }

  .aboutus .seg-detail .stat-num {
    font-size: 45px
  }

  .aboutus .seg-detail .imgband .bimg {
    height: 160px
  }
}