@import "https://cdn.jsdelivr.net/npm/@fontsource/inter@latest/400.css";
@import "https://cdn.jsdelivr.net/npm/@fontsource/inter@latest/500.css";
@import "https://cdn.jsdelivr.net/npm/@fontsource/inter@latest/700.css";

* {
box-sizing: border-box
}

body {
margin: 0;
position: relative;
min-height: 100vh;
font-family: 'Inter', sans-serif
}

.page-header {
background: linear-gradient(135deg, #fff 0%, #DBFBE7 60%, #e8fdff 100%);
box-shadow: 2px 7px 20px 0 #09d0f61c;
position: relative;
overflow: hidden
}

.page-header::before {
content: '';
position: absolute;
top: -32px;
right: -64px;
width: 220px;
height: 220px;
background: linear-gradient(135deg, #09d0f614 0%, #f7a4110f 100%);
border-radius: 50%;
pointer-events: none
}

.header-top-row {
max-width: 1320px;
margin: 0 auto;
padding: 24px 32px 16px;
display: flex;
align-items: center;
gap: 16px
}

.brand-mark-box {
background: #fff;
border-radius: 9px;
box-shadow: 2px 2px 2px 0 #09d0f60f 2px 7px 20px 0 #09d0f61c;
border: 1.5px solid #09d0f62e;
padding: 8px;
display: flex;
align-items: center;
justify-content: center;
width: 70px;
height: 70px;
flex-shrink: 0
}

.brand-mark-box img {
width: 55px;
height: 55px;
object-fit: contain;
display: block
}

.brand-name-text {
font-size: 31px;
font-weight: 700;
line-height: 1.1;
letter-spacing: -.02em;
background: linear-gradient(90deg, #09D0F6 0%, #0aa8c8 100%);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
user-select: none
}

.header-nav-row {
border-top: 1.5px solid #09d0f626;
background: linear-gradient(90deg, #09d0f612 0%, #dbfbe780 100%)
}

.header-nav-inner {
max-width: 1320px;
margin: 0 auto;
padding: 0 32px;
display: flex;
align-items: stretch;
gap: 4px;
flex-wrap: wrap
}

.nav-link {
display: inline-flex;
align-items: center;
padding: 16px 24px;
font-size: 15px;
font-weight: 500;
line-height: 1.4;
letter-spacing: .01em;
color: #1a3a4a;
text-decoration: none;
border-radius: 0;
transition: color .22s cubic-bezier(0.4, 0, 0.2, 1), background .25s cubic-bezier(0.0, 0, 0.2, 1);
position: relative;
min-height: 44px
}

.nav-link::after {
content: '';
position: absolute;
bottom: 0;
left: 24px;
right: 24px;
height: 2px;
background: linear-gradient(90deg, #09D0F6, #F7A411);
border-radius: 2px;
transform: scaleX(0);
transition: transform .22s cubic-bezier(0.4, 0, 0.2, 1)
}

.nav-link:hover {
color: #09D0F6;
background: #09d0f60f;
text-decoration: none
}

.nav-link:hover::after {
transform: scaleX(1)
}

.nav-link:focus {
outline: 2px solid #09D0F6;
outline-offset: -2px;
text-decoration: underline
}

.nav-link.active-page {
color: #09D0F6;
font-weight: 700
}

.nav-link.active-page::after {
transform: scaleX(1)
}

.page-footer {
background: linear-gradient(180deg, #0d2a35 0%, #0a1e28 100%);
position: relative;
overflow: hidden
}

.footer-wave {
display: block;
width: 100%;
height: 48px;
margin-bottom: -1px
}

.footer-body-box {
max-width: 1320px;
margin: 0 auto;
padding: 32px 32px 0;
display: flex;
align-items: center;
gap: 32px;
flex-wrap: wrap
}

.footer-logo-box {
background: #fff;
border-radius: 9px;
box-shadow: 2px 9px 40px 0 #09d0f621;
border: 1.5px solid #09d0f638;
padding: 8px;
display: flex;
align-items: center;
justify-content: center;
width: 64px;
height: 64px;
flex-shrink: 0
}

.footer-logo-box img {
width: 50px;
height: 50px;
object-fit: contain;
display: block
}

.footer-brand-label {
font-size: 19px;
font-weight: 700;
line-height: 1.4;
color: #fff;
letter-spacing: .01em
}

.footer-tagline {
font-size: 15px;
font-weight: 400;
line-height: 1.7;
color: #dbfbe7b3;
letter-spacing: .01em;
margin-top: 4px
}

.footer-divider {
border: none;
border-top: 1px solid #09d0f61f;
margin: 32px 32px 0;
max-width: calc(1320px - 64px);
margin-left: auto;
margin-right: auto
}

.footer-bottom-bar {
max-width: 1320px;
margin: 0 auto;
padding: 16px 32px 24px;
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 16px
}

.footer-copyright {
font-size: 15px;
line-height: 1.7;
color: #dbfbe78c;
letter-spacing: .01em
}

.footer-legal-links {
display: flex;
align-items: center;
gap: 8px;
flex-wrap: wrap
}

.footer-legal-link {
font-size: 15px;
line-height: 1.7;
color: #dbfbe7a6;
text-decoration: none;
padding: 4px 8px;
border-radius: 5px;
transition: color .2s cubic-bezier(0.4, 0, 0.2, 1), background .24s cubic-bezier(0.0, 0, 0.2, 1);
min-height: 44px;
display: inline-flex;
align-items: center
}

.footer-legal-link:hover {
color: #09D0F6;
background: #09d0f614;
text-decoration: none
}

.footer-legal-link:focus {
outline: 2px solid #09D0F6;
outline-offset: 2px;
text-decoration: underline
}

.footer-dot {
width: 3px;
height: 3px;
border-radius: 50%;
background: #09d0f64d;
display: inline-block;
flex-shrink: 0
}

@media (max-width: 768px) {
.header-top-row {
padding: 16px 16px 8px;
gap: 16px
}

.brand-name-text {
font-size: 19px
}

.brand-mark-box {
width: 55px;
height: 55px
}

.brand-mark-box img {
width: 44px;
height: 44px
}

.header-nav-inner {
padding: 0 8px
}

.nav-link {
padding: 12px 16px;
font-size: 15px
}

.footer-body-box {
padding: 24px 16px 0;
gap: 16px
}

.footer-bottom-bar {
padding: 16px 16px 24px;
flex-direction: column;
align-items: flex-start;
gap: 8px
}

.footer-divider {
margin-left: 16px;
margin-right: 16px
}
}

@media (min-width: 769px) and (max-width: 1280px) {
.header-top-row {
padding: 24px 24px 16px
}

.header-nav-inner {
padding: 0 24px
}

.footer-body-box {
padding: 32px 24px 0
}

.footer-bottom-bar {
padding: 16px 24px 24px
}
}

.doc-area {
max-width: 1320px;
margin: 0 auto;
padding: 64px 32px
}

.doc-area h1 {
font-size: 70px;
line-height: 1.1;
letter-spacing: -.03em;
margin-bottom: 32px;
background: linear-gradient(135deg, #09D0F6 0%, #0a9ab8 100%);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent
}

.doc-area h2 {
font-size: 31px;
line-height: 1.1;
letter-spacing: -.01em;
color: #1a2a3a;
margin-top: 64px;
margin-bottom: 16px;
padding-bottom: 8px;
border-bottom: 2px solid #DBFBE7
}

.doc-area h3 {
font-size: 19px;
line-height: 1.4;
letter-spacing: 0;
color: #1a2a3a;
margin-top: 32px;
margin-bottom: 8px
}

.doc-area h4,
.doc-area h5,
.doc-area h6 {
font-size: 15px;
line-height: 1.4;
letter-spacing: .01em;
color: #2a3a4a;
margin-top: 24px;
margin-bottom: 8px
}

.doc-area p {
font-size: 15px;
line-height: 1.7;
letter-spacing: .01em;
color: #2a3a4a;
margin-bottom: 16px
}

.doc-area ul,
.doc-area ol {
margin: 16px 0 24px 24px;
padding: 0
}

.doc-area ul {
list-style: none
}

.doc-area ul li {
position: relative;
padding-left: 16px;
font-size: 15px;
line-height: 1.7;
color: #2a3a4a;
margin-bottom: 8px
}

.doc-area ul li::before {
content: '';
position: absolute;
left: 0;
top: 10px;
width: 6px;
height: 6px;
border-radius: 2px;
background: #09D0F6
}

.doc-area ol li {
font-size: 15px;
line-height: 1.7;
color: #2a3a4a;
margin-bottom: 8px;
padding-left: 4px
}

.doc-area strong,
.doc-area b {
font-weight: 700;
color: #1a2a3a
}

.doc-area table {
width: 100%;
border-collapse: collapse;
margin: 32px 0;
font-size: 15px;
line-height: 1.4;
box-shadow: 2px 7px 20px 0 #09d0f61c;
border-radius: 9px;
overflow: hidden
}

.doc-area thead {
background: linear-gradient(90deg, #09D0F6 0%, #0abcd8 100%)
}

.doc-area thead th {
color: #fff;
font-size: 15px;
font-weight: 700;
letter-spacing: .02em;
padding: 16px;
text-align: left
}

.doc-area tbody tr {
transition: background-color .22s cubic-bezier(0.4, 0, 0.2, 1)
}

.doc-area tbody tr:nth-child(even) {
background: #f4fdff
}

.doc-area tbody tr:hover {
background: #DBFBE7
}

.doc-area td {
padding: 16px;
color: #2a3a4a;
font-size: 15px;
line-height: 1.4;
border-bottom: 1px solid #e8f8fb
}

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

.doc-area hr {
border: none;
height: 2px;
background: linear-gradient(90deg, #09D0F6 0%, #DBFBE7 60%, transparent 100%);
margin: 64px 0;
border-radius: 2px
}

.doc-area div {
font-size: 15px;
line-height: 1.7;
color: #2a3a4a
}

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

.doc-area h1 {
font-size: 31px;
margin-bottom: 24px
}

.doc-area h2 {
font-size: 19px;
margin-top: 32px
}

.doc-area table {
display: block;
overflow-x: auto;
border-radius: 5px
}

.doc-area hr {
margin: 32px 0
}
}

@media (min-width: 769px) and (max-width: 1280px) {
.doc-area {
padding: 64px 32px
}

.doc-area h1 {
font-size: 31px
}
}

.contact-us {
max-width: 1320px;
margin: 0 auto;
padding: 0 16px;
overflow: hidden
}

.contact-us .circles-bg {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
pointer-events: none;
overflow: hidden;
border-radius: 0
}

.contact-us .circle-one {
position: absolute;
width: 320px;
height: 320px;
border-radius: 50%;
background: #09d0f612;
top: -80px;
right: -60px
}

.contact-us .circle-two {
position: absolute;
width: 180px;
height: 180px;
border-radius: 50%;
background: #f7a4110f;
bottom: 40px;
left: 20px
}

.contact-us .circle-three {
position: absolute;
width: 90px;
height: 90px;
border-radius: 50%;
background: #dbfbe72e;
top: 60px;
left: 40%
}

.contact-us .page-lead {
position: relative;
text-align: center;
padding: 64px 32px 32px;
background: linear-gradient(to top, #fff 0%, #09d0f614 100%)
}

.contact-us .page-lead .geo-anchor {
display: inline-block;
width: 8px;
height: 8px;
background: #F7A411;
border-radius: 2px;
transform: rotate(45deg);
margin-bottom: 16px
}

.contact-us .lead-heading {
font-size: 70px;
line-height: 1.1;
letter-spacing: -.03em;
margin: 0 0 16px;
color: #111
}

.contact-us .lead-heading .first-letter {
font-size: 70px;
color: #09D0F6
}

.contact-us .lead-heading .sweep-text {
display: inline-block;
background: linear-gradient(90deg, #111 0%, #09D0F6 40%, #F7A411 70%, #111 100%);
background-size: 200% auto;
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
animation: sweep-color 2.2s cubic-bezier(0.4, 0, 0.2, 1) forwards
}

@keyframes sweep-color {
0% {
background-position: 200% center
}

100% {
background-position: 0 center
}
}

.contact-us .lead-slogan {
font-size: 19px;
line-height: 1.7;
color: #333;
max-width: 560px;
margin: 0 auto
}

.contact-us .divider-thin {
width: 100%;
height: 1px;
background: linear-gradient(to right, transparent, #09D0F6 30%, #F7A411 70%, transparent);
margin: 32px 0 0
}

.contact-us .contact-body {
position: relative;
padding: 64px 0;
background: #fff
}

.contact-us .contact-grid {
display: grid;
grid-template-columns: 1fr 1.6fr;
gap: 64px;
align-items: start
}

.contact-us .contact-details-panel {
padding: 32px;
background: linear-gradient(to top, #DBFBE7 0%, #fff 100%);
border-radius: 16px;
box-shadow: 2px 7px 20px 0 #09d0f61c
}

.contact-us .panel-label {
font-size: 15px;
line-height: 1.4;
letter-spacing: .06em;
text-transform: uppercase;
color: #09D0F6;
margin: 0 0 16px
}

.contact-us .panel-heading {
font-size: 31px;
line-height: 1.1;
letter-spacing: -.01em;
color: #111;
margin: 0 0 24px
}

.contact-us .panel-heading .first-letter {
color: #F7A411
}

.contact-us .detail-item {
display: flex;
flex-direction: row;
align-items: flex-start;
gap: 16px;
margin-bottom: 24px
}

.contact-us .detail-icon {
flex-shrink: 0;
width: 40px;
height: 40px;
border-radius: 9px;
background: #09D0F6;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 2px 2px 2px 0 #09d0f60f
}

.contact-us .detail-icon svg {
width: 20px;
height: 20px;
fill: #fff
}

.contact-us .detail-text {
flex: 1
}

.contact-us .detail-label {
font-size: 15px;
line-height: 1.4;
color: #555;
margin: 0 0 4px
}

.contact-us .detail-value {
font-size: 19px;
line-height: 1.4;
color: #111;
margin: 0;
word-break: break-word
}

.contact-us .detail-value a {
color: #111;
text-decoration: none;
transition: color .22s cubic-bezier(0.4, 0, 0.2, 1)
}

.contact-us .detail-value a:hover {
color: #09D0F6
}

.contact-us .detail-value a:focus {
outline: 2px solid #09D0F6;
outline-offset: 2px;
border-radius: 2px;
text-decoration: underline
}

.contact-us .channel-note {
margin-top: 32px;
padding: 16px;
background: #09d0f612;
border-radius: 9px;
font-size: 15px;
line-height: 1.7;
color: #333
}

.contact-us .form-panel {
padding: 32px;
background: #fff;
border-radius: 16px;
box-shadow: 2px 9px 40px 0 #09d0f621
}

.contact-us .form-heading {
font-size: 31px;
line-height: 1.1;
letter-spacing: -.01em;
color: #111;
margin: 0 0 8px;
text-align: center
}

.contact-us .form-heading .first-letter {
color: #09D0F6
}

.contact-us .form-sub {
font-size: 15px;
line-height: 1.7;
color: #555;
text-align: center;
margin: 0 0 32px
}

.contact-us .form-row {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
margin-bottom: 16px
}

.contact-us .form-field {
display: flex;
flex-direction: column;
gap: 8px;
margin-bottom: 16px
}

.contact-us .form-field.full {
margin-bottom: 16px
}

.contact-us .field-label {
font-size: 15px;
line-height: 1.4;
color: #333;
font-weight: 600
}

.contact-us .field-label .required-mark {
color: #F7A411;
margin-left: 4px
}

.contact-us .form-input {
padding: 12px 16px;
border: 1.5px solid #ccc;
border-radius: 9px;
font-size: 15px;
line-height: 1.4;
color: #111;
background: #fff;
transition: border-color .22s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .24s cubic-bezier(0.0, 0, 0.2, 1);
box-shadow: inset 1px 1px 2px 0 #09d0f60f;
width: 100%;
box-sizing: border-box
}

.contact-us .form-input::placeholder {
font-style: italic;
opacity: .55;
color: #555
}

.contact-us .form-input:focus {
outline: none;
border-color: #09D0F6;
box-shadow: 0 0 0 3px #09d0f621 inset 1px 1px 2px 0 #09d0f60f
}

.contact-us .channel-group {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 8px;
margin-top: 4px
}

.contact-us .channel-option {
position: relative
}

.contact-us .channel-option input[type="radio"] {
position: absolute;
opacity: 0;
width: 0;
height: 0
}

.contact-us .channel-option label {
display: flex;
flex-direction: row;
align-items: center;
gap: 8px;
padding: 8px 16px;
border-radius: 24px;
border: 1.5px solid #ccc;
font-size: 15px;
line-height: 1.4;
color: #333;
cursor: pointer;
transition: border-color .2s cubic-bezier(0.4, 0, 0.2, 1), background .2s cubic-bezier(0.4, 0, 0.2, 1), color .2s cubic-bezier(0.4, 0, 0.2, 1);
user-select: none
}

.contact-us .channel-option label svg {
width: 16px;
height: 16px;
flex-shrink: 0
}

.contact-us .channel-option input[type="radio"]:checked+label {
border-color: #09D0F6;
background: #09d0f61a;
color: #0a7a94
}

.contact-us .channel-option input[type="radio"]:focus+label {
outline: 2px solid #09D0F6;
outline-offset: 2px
}

.contact-us .channel-option label:hover {
border-color: #09D0F6;
background: #09d0f60f
}

.contact-us .privacy-row {
display: flex;
flex-direction: row;
align-items: flex-start;
gap: 12px;
margin-bottom: 24px;
margin-top: 8px
}

.contact-us .privacy-checkbox {
flex-shrink: 0;
width: 18px;
height: 18px;
margin-top: 2px;
accent-color: #09D0F6;
cursor: pointer
}

.contact-us .privacy-text {
font-size: 15px;
line-height: 1.7;
color: #444;
margin: 0
}

.contact-us .privacy-text a {
color: #09D0F6;
text-decoration: underline;
transition: color .2s cubic-bezier(0.4, 0, 0.2, 1)
}

.contact-us .privacy-text a:hover {
color: #0a7a94
}

.contact-us .privacy-text a:focus {
outline: 2px solid #09D0F6;
outline-offset: 2px;
border-radius: 2px
}

.contact-us .submit-btn {
display: block;
width: 100%;
padding: 16px 32px;
border: none;
border-radius: 9px;
font-size: 19px;
line-height: 1.4;
color: #fff;
background: linear-gradient(to top, #09D0F6 0%, #F7A411 100%);
cursor: pointer;
box-shadow: 2px 7px 20px 0 #09d0f61c;
transition: opacity .22s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .26s cubic-bezier(0.0, 0, 0.2, 1);
position: relative;
overflow: hidden
}

.contact-us .submit-btn:hover {
opacity: .92;
box-shadow: 2px 9px 40px 0 #09d0f621
}

.contact-us .submit-btn:focus {
outline: 3px solid #F7A411;
outline-offset: 3px
}

.contact-us .submit-btn:active {
opacity: .85
}

.contact-us .divider-thick {
width: 100%;
height: 3px;
background: linear-gradient(to right, #09D0F6, #DBFBE7, #F7A411);
margin: 0;
border-radius: 2px
}

@keyframes geo-spin {
from {
transform: rotate(0deg)
}

to {
transform: rotate(360deg)
}
}

.contact-us .bg-geo {
position: absolute;
width: 220px;
height: 220px;
border: 2px solid #09d0f617;
border-radius: 16px;
top: 30px;
right: -60px;
animation: geo-spin 28s linear infinite;
pointer-events: none
}

@media (max-width: 768px) {
.contact-us .lead-heading {
font-size: 31px
}

.contact-us .lead-heading .first-letter {
font-size: 31px
}

.contact-us .contact-grid {
grid-template-columns: 1fr;
gap: 32px
}

.contact-us .form-row {
grid-template-columns: 1fr
}

.contact-us .page-lead {
padding: 32px 16px 24px
}

.contact-us .contact-body {
padding: 32px 0
}

.contact-us .contact-details-panel,
.contact-us .form-panel {
padding: 24px 16px
}
}

@media (min-width: 769px) and (max-width: 1280px) {
.contact-us .contact-grid {
grid-template-columns: 1fr 1.4fr;
gap: 32px
}

.contact-us .lead-heading {
font-size: 70px
}
}

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

.first .page-band {
width: 100%;
height: 4px;
background: linear-gradient(to right, #09D0F6, #F7A411, #09D0F6)
}

.first .bounded {
max-width: 1320px;
margin: 0 auto;
padding: 0 24px
}

.first .title-area {
padding: 64px 0;
background: linear-gradient(to top, #DBFBE7 0%, #fff 100%);
border-top: 3px solid #09D0F6;
border-bottom: 3px solid #F7A411;
position: relative
}

.first .title-area-inner {
display: flex;
flex-direction: row;
align-items: center;
gap: 64px
}

.first .title-image-frame {
position: relative;
flex: 0 0 420px
}

.first .title-shape-a {
position: absolute;
width: 180px;
height: 180px;
border: 2px solid #09d0f638;
border-radius: 24px;
top: -16px;
left: -16px;
pointer-events: none
}

.first .title-shape-b {
position: absolute;
width: 120px;
height: 120px;
border: 2px solid #f7a4112e;
border-radius: 16px;
bottom: -16px;
right: -16px;
pointer-events: none
}

.first .title-img {
display: block;
width: 420px;
height: 420px;
object-fit: cover;
object-position: center;
border-radius: 16px;
aspect-ratio: 1/1;
box-shadow: 2px 9px 40px 0 #09d0f621
}

.first .title-text {
flex: 1
}

.first .title-text h1 {
font-size: 70px;
line-height: 1.1;
letter-spacing: -.03em;
color: #111820;
margin: 0 0 24px
}

.first .title-text h1 .accent-first {
font-size: 1.1em;
color: #09D0F6
}

.first .title-sub {
font-size: 19px;
line-height: 1.7;
color: #2a3540;
margin: 0 0 32px
}

.first .btn-primary {
display: inline-block;
padding: 16px 32px;
background: linear-gradient(to top, #F7A411, #09D0F6);
color: #111820;
font-size: 15px;
font-weight: 700;
border-radius: 9px;
text-decoration: none;
border: none;
cursor: pointer;
transition: box-shadow .22s cubic-bezier(0.4, 0, 0.2, 1), transform .2s cubic-bezier(0.0, 0, 0.2, 1);
box-shadow: 2px 7px 20px 0 #09d0f61c
}

.first .btn-primary:hover {
box-shadow: 2px 9px 40px 0 #09d0f621;
transform: translateY(-2px)
}

.first .btn-primary:focus {
outline: 2px solid #F7A411;
outline-offset: 3px
}

.first .btn-primary:active {
transform: translateY(0)
}

.first .gap-area {
padding: 64px 0;
background: #fff
}

.first .gap-inner {
display: grid;
grid-template-columns: 3fr 1fr;
gap: 64px;
align-items: start
}

.first .gap-main h2 {
font-size: 31px;
line-height: 1.4;
letter-spacing: -.01em;
color: #111820;
margin: 0 0 24px
}

.first .shape-anchor {
display: inline-block;
width: 8px;
height: 8px;
background: #09D0F6;
border-radius: 2px;
margin-right: 8px;
vertical-align: middle;
margin-bottom: 3px
}

.first .gap-main p {
font-size: 15px;
line-height: 1.7;
color: #2a3540;
margin: 0 0 16px
}

.first .gap-aside {
border-top: 2px solid #09D0F6;
border-bottom: 2px solid #F7A411;
padding: 24px 16px
}

.first .gap-aside-label {
font-size: 15px;
line-height: 1.4;
color: #09D0F6;
font-weight: 700;
margin: 0 0 8px;
letter-spacing: .04em;
text-transform: uppercase
}

.first .gap-aside-value {
font-size: 31px;
line-height: 1.1;
color: #111820;
font-weight: 700;
margin: 0 0 16px
}

.first .gap-aside p {
font-size: 15px;
line-height: 1.7;
color: #2a3540;
margin: 0
}

.first .support-area {
padding: 64px 0;
background: linear-gradient(to top, #09D0F6 0%, #fff 100%);
position: relative;
overflow: hidden
}

.first .support-noise {
position: absolute;
inset: 0;
pointer-events: none;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
background-repeat: repeat;
opacity: .6
}

.first .support-inner {
position: relative;
z-index: 1
}

.first .support-heading {
text-align: center;
margin: 0 0 48px
}

.first .support-heading h2 {
font-size: 31px;
line-height: 1.4;
letter-spacing: -.01em;
color: #111820;
margin: 0 0 16px
}

.first .support-heading p {
font-size: 15px;
line-height: 1.7;
color: #2a3540;
max-width: 600px;
margin: 0 auto
}

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

.first .support-card {
background: #fff;
border-radius: 16px;
padding: 32px 24px;
box-shadow: 2px 7px 20px 0 #09d0f61c;
border-top: 3px solid #09D0F6;
transition: box-shadow .25s cubic-bezier(0.4, 0, 0.2, 1)
}

.first .support-card:hover {
box-shadow: 2px 9px 40px 0 #09d0f621
}

.first .support-card-icon {
width: 40px;
height: 40px;
margin: 0 0 16px
}

.first .support-card h3 {
font-size: 19px;
line-height: 1.4;
color: #111820;
margin: 0 0 8px
}

.first .support-card p {
font-size: 15px;
line-height: 1.7;
color: #2a3540;
margin: 0
}

.first .experience-area {
padding: 64px 0;
background: #DBFBE7;
border-top: 3px solid #F7A411
}

.first .experience-inner {
display: flex;
flex-direction: row;
gap: 64px;
align-items: stretch
}

.first .experience-left {
flex: 1;
display: flex;
flex-direction: column;
gap: 24px
}

.first .experience-divider {
width: 1px;
background: #09D0F6;
flex: 0 0 1px;
align-self: stretch
}

.first .experience-right {
flex: 1
}

.first .experience-right h2 {
font-size: 31px;
line-height: 1.4;
letter-spacing: -.01em;
color: #111820;
margin: 0 0 24px;
text-align: center
}

.first .experience-right p {
font-size: 15px;
line-height: 1.7;
color: #2a3540;
margin: 0 0 16px
}

.first .phase-item {
background: #fff;
border-radius: 9px;
padding: 16px 24px;
box-shadow: 2px 2px 2px 0 #09d0f60f;
display: flex;
flex-direction: row;
gap: 16px;
align-items: flex-start;
transition: box-shadow .28s cubic-bezier(0.0, 0, 0.2, 1)
}

.first .phase-item:hover {
box-shadow: 2px 7px 20px 0 #09d0f61c
}

.first .phase-num {
font-size: 31px;
line-height: 1.1;
color: #09D0F6;
font-weight: 700;
flex: 0 0 auto
}

.first .phase-text h4 {
font-size: 15px;
line-height: 1.4;
color: #111820;
font-weight: 700;
margin: 0 0 4px
}

.first .phase-text p {
font-size: 15px;
line-height: 1.7;
color: #2a3540;
margin: 0
}

.first .experience-img {
width: 100%;
aspect-ratio: 1/1;
object-fit: cover;
object-position: center;
border-radius: 16px;
display: block;
margin: 0 0 24px
}

.first .team-area {
padding: 64px 0;
background: #fff;
border-bottom: 3px solid #09D0F6
}

.first .team-inner {
display: grid;
grid-template-columns: 1fr 3fr;
gap: 64px;
align-items: start
}

.first .team-portrait-col {
display: flex;
flex-direction: column;
align-items: center;
gap: 16px
}

.first .team-portrait {
width: 100%;
aspect-ratio: 4/5;
object-fit: cover;
object-position: top;
border-radius: 16px;
display: block;
box-shadow: 2px 7px 20px 0 #09d0f61c
}

.first .team-name {
font-size: 19px;
line-height: 1.4;
color: #111820;
font-weight: 700;
text-align: center;
margin: 0
}

.first .team-role {
font-size: 15px;
line-height: 1.4;
color: #09D0F6;
text-align: center;
margin: 0
}

.first .team-text h2 {
font-size: 31px;
line-height: 1.4;
letter-spacing: -.01em;
color: #111820;
margin: 0 0 24px;
text-align: center
}

.first .team-text p {
font-size: 15px;
line-height: 1.7;
color: #2a3540;
margin: 0 0 16px
}

.first .team-credentials {
display: flex;
flex-direction: row;
gap: 16px;
flex-wrap: wrap;
margin: 24px 0 0
}

.first .credential-tag {
background: #DBFBE7;
border-radius: 5px;
padding: 8px 16px;
font-size: 15px;
line-height: 1.4;
color: #111820;
font-weight: 600
}

.first .reputation-area {
padding: 64px 0;
background: linear-gradient(to top, #F7A411 0%, #fff 100%);
border-top: 3px solid #DBFBE7
}

.first .reputation-heading {
text-align: center;
margin: 0 0 48px
}

.first .reputation-heading h2 {
font-size: 31px;
line-height: 1.4;
letter-spacing: -.01em;
color: #111820;
margin: 0 0 16px
}

.first .reputation-heading p {
font-size: 15px;
line-height: 1.7;
color: #2a3540;
max-width: 580px;
margin: 0 auto
}

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

.first .rep-item {
display: flex;
flex-direction: row;
gap: 16px;
align-items: flex-start;
padding: 24px;
background: #fff;
border-radius: 9px;
box-shadow: 2px 2px 2px 0 #09d0f60f;
border-top: 2px solid #F7A411;
transition: box-shadow .2s cubic-bezier(0.4, 0, 0.2, 1)
}

.first .rep-item:hover {
box-shadow: 2px 7px 20px 0 #09d0f61c
}

.first .rep-icon {
flex: 0 0 40px;
width: 40px;
height: 40px
}

.first .rep-text h4 {
font-size: 15px;
line-height: 1.4;
color: #111820;
font-weight: 700;
margin: 0 0 8px
}

.first .rep-text p {
font-size: 15px;
line-height: 1.7;
color: #2a3540;
margin: 0
}

.first .rep-images {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
margin: 32px 0 0
}

.first .rep-img {
width: 100%;
aspect-ratio: 1/1;
object-fit: cover;
object-position: center;
border-radius: 9px;
display: block
}

.first .current-area {
padding: 64px 0;
background: #111820;
border-top: 3px solid #09D0F6
}

.first .current-inner {
display: flex;
flex-direction: row;
gap: 64px;
align-items: center
}

.first .current-text {
flex: 1
}

.first .current-text h2 {
font-size: 31px;
line-height: 1.4;
letter-spacing: -.01em;
color: #fff;
margin: 0 0 24px;
text-align: center
}

.first .current-text p {
font-size: 15px;
line-height: 1.7;
color: #c8d4dc;
margin: 0 0 16px
}

.first .current-text p:last-child {
margin: 0
}

.first .current-visual {
flex: 0 0 380px;
display: flex;
flex-direction: column;
gap: 16px
}

.first .current-img {
width: 100%;
aspect-ratio: 1/1;
object-fit: cover;
object-position: center;
border-radius: 16px;
display: block;
box-shadow: 2px 9px 40px 0 #09d0f621
}

.first .flicker-bar {
height: 4px;
border-radius: 2px;
background: #09D0F6;
animation: flicker-anim 2.4s cubic-bezier(0.4, 0, 0.2, 1) infinite
}

.first .flicker-bar.alt {
background: #F7A411;
animation-delay: 1.2s;
animation-duration: 3.1s
}

@keyframes flicker-anim {

0%,
100% {
opacity: 1
}

35% {
opacity: .3
}

60% {
opacity: .8
}

80% {
opacity: .2
}
}

.first .hover-border-box {
border: 2px solid transparent;
border-radius: 9px;
transition: border-color .22s cubic-bezier(0.4, 0, 0.2, 1);
padding: 16px
}

.first .hover-border-box:hover {
border-color: #09D0F6
}

.first .hover-border-box:hover .hb-top {
width: 100%
}

@media (max-width: 1280px) {
.first .title-image-frame {
flex: 0 0 340px
}

.first .title-img {
width: 340px;
height: 340px
}

.first .title-text h1 {
font-size: 55px
}

.first .gap-inner {
grid-template-columns: 2fr 1fr;
gap: 32px
}

.first .support-grid {
grid-template-columns: repeat(2, 1fr)
}

.first .team-inner {
grid-template-columns: 1fr 2fr;
gap: 32px
}

.first .current-visual {
flex: 0 0 280px
}
}

@media (max-width: 768px) {
.first .title-area-inner {
flex-direction: column;
gap: 32px
}

.first .title-image-frame {
flex: 0 0 auto;
width: 100%;
max-width: 320px;
margin: 0 auto
}

.first .title-img {
width: 100%;
height: auto
}

.first .title-text h1 {
font-size: 31px
}

.first .gap-inner {
grid-template-columns: 1fr;
gap: 32px
}

.first .support-grid {
grid-template-columns: 1fr
}

.first .experience-inner {
flex-direction: column;
gap: 32px
}

.first .experience-divider {
width: 100%;
height: 1px;
flex: 0 0 1px;
align-self: auto
}

.first .team-inner {
grid-template-columns: 1fr;
gap: 32px
}

.first .reputation-grid {
grid-template-columns: 1fr
}

.first .rep-images {
grid-template-columns: 1fr
}

.first .current-inner {
flex-direction: column;
gap: 32px
}

.first .current-visual {
flex: 0 0 auto;
width: 100%
}
}

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

.about-us .page-bound {
max-width: 1320px;
margin: 0 auto;
padding: 0 24px
}

.about-us .bento-grid {
display: grid;
grid-template-columns: 1.6fr 1fr 1fr;
grid-template-rows: auto auto;
gap: 16px;
padding: 64px 24px;
max-width: 1320px;
margin: 0 auto;
position: relative
}

.about-us .bento-grid::before {
content: "";
position: absolute;
inset: 0;
background-image: radial-gradient(circle, #09d0f614 1px, transparent 1px);
background-size: 28px 28px;
pointer-events: none;
z-index: 0
}

.about-us .bento-text-cell {
grid-column: 2 / 4;
grid-row: 1 / 2;
background: linear-gradient(to top, #09D0F6, #fff);
border-radius: 16px;
padding: 32px;
display: flex;
flex-direction: column;
justify-content: center;
position: relative;
z-index: 1;
box-shadow: 2px 7px 20px 0 #09d0f61c
}

.about-us .bento-image-cell {
grid-column: 1 / 2;
grid-row: 1 / 3;
border-radius: 16px;
overflow: hidden;
position: relative;
z-index: 1;
box-shadow: 2px 9px 40px 0 #09d0f621;
aspect-ratio: 1/1
}

.about-us .bento-image-cell img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
display: block;
filter: saturate(1.15) brightness(1.05) sepia(0.12)
}

.about-us .bento-stat-cell {
border-radius: 9px;
padding: 24px;
display: flex;
flex-direction: column;
justify-content: flex-end;
position: relative;
z-index: 1;
box-shadow: 2px 2px 2px 0 #09d0f60f
}

.about-us .bento-stat-cell.mint {
background: #DBFBE7;
grid-column: 2 / 3;
grid-row: 2 / 3
}

.about-us .bento-stat-cell.amber {
background: linear-gradient(to top, #F7A411, #fff);
grid-column: 3 / 4;
grid-row: 2 / 3
}

.about-us .bento-heading {
font-size: 70px;
line-height: 1.1;
letter-spacing: -.03em;
margin: 0 0 16px;
color: #0d1a22
}

.about-us .bento-heading .first-letter {
font-size: 70px;
color: #09D0F6
}

.about-us .bento-desc {
font-size: 19px;
line-height: 1.7;
color: #1e3040;
margin: 0 0 24px
}

.about-us .bento-links {
display: flex;
flex-direction: row;
gap: 16px;
flex-wrap: wrap
}

.about-us .btn-primary {
display: inline-block;
padding: 16px 32px;
border-radius: 5px;
background: linear-gradient(to top, #09D0F6, #b3f0fc);
color: #0d1a22;
font-size: 15px;
line-height: 1.4;
text-decoration: none;
font-weight: 700;
letter-spacing: .04em;
box-shadow: 2px 7px 20px 0 #09d0f61c;
transition: background .22s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .25s cubic-bezier(0.4, 0, 0.2, 1)
}

.about-us .btn-primary:hover {
background: linear-gradient(to top, #07b8da, #09D0F6);
box-shadow: 2px 9px 40px 0 #09d0f621
}

.about-us .btn-secondary {
display: inline-block;
padding: 16px 32px;
border-radius: 5px;
background: #fff;
border: 2px solid #09D0F6;
color: #0d1a22;
font-size: 15px;
line-height: 1.4;
text-decoration: none;
font-weight: 600;
letter-spacing: .04em;
transition: border-color .2s cubic-bezier(0.4, 0, 0.2, 1), background .2s cubic-bezier(0.4, 0, 0.2, 1)
}

.about-us .btn-secondary:hover {
background: #DBFBE7;
border-color: #F7A411
}

.about-us .stat-number {
font-size: 31px;
line-height: 1.1;
letter-spacing: -.02em;
color: #0d1a22;
font-weight: 800;
margin: 0 0 8px
}

.about-us .stat-label {
font-size: 15px;
line-height: 1.4;
color: #2a4050;
margin: 0
}

.about-us .divider-triangle {
width: 100%;
line-height: 0;
overflow: hidden
}

.about-us .divider-triangle svg {
display: block;
width: 100%
}

.about-us .depth-section {
background: #f2f9fb;
position: relative;
padding: 0 0 64px
}

.about-us .depth-section::before {
content: "";
position: absolute;
inset: 0;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23noise)' opacity='0.045'/%3E%3C/svg%3E");
pointer-events: none;
z-index: 0
}

.about-us .depth-inner {
max-width: 1320px;
margin: 0 auto;
padding: 0 24px;
position: relative;
z-index: 1
}

.about-us .depth-top-row {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 32px;
margin-bottom: 32px;
padding-top: 64px
}

.about-us .contrast-block {
border-radius: 16px;
overflow: hidden;
box-shadow: 2px 9px 40px 0 #09d0f621;
display: grid;
grid-template-columns: 1fr 1fr
}

.about-us .contrast-before {
background: #e8f0f5;
padding: 32px;
display: flex;
flex-direction: column;
justify-content: space-between;
border-right: 1px dashed #09d0f666
}

.about-us .contrast-after {
background: linear-gradient(to top, #09D0F6, #DBFBE7);
padding: 32px;
display: flex;
flex-direction: column;
justify-content: space-between
}

.about-us .contrast-label {
font-size: 15px;
line-height: 1.4;
letter-spacing: .08em;
font-weight: 700;
text-transform: uppercase;
margin: 0 0 16px;
color: #5a7080
}

.about-us .contrast-label.after {
color: #0d1a22
}

.about-us .contrast-text {
font-size: 15px;
line-height: 1.7;
color: #3a5060;
margin: 0
}

.about-us .contrast-text.after {
color: #0d1a22
}

.about-us .contrast-icon {
width: 32px;
height: 32px;
margin-bottom: 16px
}

.about-us .profile-stack {
display: flex;
flex-direction: column;
gap: 16px
}

.about-us .profile-card {
display: grid;
grid-template-columns: 80px 1fr;
gap: 16px;
background: #fff;
border-radius: 9px;
padding: 16px;
box-shadow: 2px 2px 2px 0 #09d0f60f;
align-items: center
}

.about-us .profile-portrait {
width: 80px;
height: 103px;
overflow: hidden;
flex-shrink: 0
}

.about-us .profile-portrait img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
display: block
}

.about-us .profile-name {
font-size: 19px;
line-height: 1.4;
color: #0d1a22;
font-weight: 700;
margin: 0 0 4px
}

.about-us .profile-role {
font-size: 15px;
line-height: 1.4;
color: #F7A411;
font-weight: 600;
margin: 0 0 8px
}

.about-us .profile-quote {
font-size: 15px;
line-height: 1.7;
color: #3a5060;
margin: 0
}

.about-us .depth-bottom-row {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 16px;
margin-bottom: 32px
}

.about-us .image-frame {
border-radius: 9px;
overflow: hidden;
box-shadow: 2px 7px 20px 0 #09d0f61c;
aspect-ratio: 1/1;
position: relative
}

.about-us .image-frame img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
display: block
}

.about-us .image-frame::after {
content: "";
position: absolute;
inset: 8px;
border: 1px solid #09d0f659;
border-radius: 5px;
pointer-events: none
}

.about-us .cert-block {
grid-column: 2 / 4;
border-radius: 16px;
background: #fff;
border: 2px dashed #09d0f680;
padding: 32px;
box-shadow: 2px 9px 40px 0 #09d0f621;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
position: relative
}

.about-us .cert-block::before {
content: "";
position: absolute;
top: 12px;
left: 12px;
right: 12px;
bottom: 12px;
border: 1px solid #f7a41140;
border-radius: 9px;
pointer-events: none
}

.about-us .cert-seal {
width: 64px;
height: 64px;
margin-bottom: 16px
}

.about-us .cert-title {
font-size: 31px;
line-height: 1.1;
letter-spacing: -.02em;
color: #0d1a22;
margin: 0 0 8px;
font-weight: 800
}

.about-us .cert-subtitle {
font-size: 15px;
line-height: 1.4;
letter-spacing: .06em;
color: #F7A411;
font-weight: 700;
text-transform: uppercase;
margin: 0 0 16px
}

.about-us .cert-desc {
font-size: 15px;
line-height: 1.7;
color: #2a4050;
max-width: 480px;
margin: 0
}

.about-us .accent-bar-block {
position: relative;
padding-left: 24px;
margin-bottom: 32px
}

.about-us .accent-bar-block::before {
content: "";
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 4px;
background: linear-gradient(to top, #09D0F6, #F7A411);
border-radius: 2px
}

.about-us .accent-bar-heading {
font-size: 31px;
line-height: 1.1;
letter-spacing: -.02em;
color: #0d1a22;
margin: 0 0 8px
}

.about-us .accent-bar-heading .shape-anchor {
display: inline-block;
width: 10px;
height: 10px;
background: #F7A411;
border-radius: 2px;
margin-right: 8px;
vertical-align: middle;
transform: rotate(45deg)
}

.about-us .accent-bar-text {
font-size: 15px;
line-height: 1.7;
color: #2a4050;
margin: 0
}

.about-us .cascade-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 16px;
margin-top: 32px
}

.about-us .cascade-item {
background: #fff;
border-radius: 9px;
padding: 24px 16px;
box-shadow: 2px 2px 2px 0 #09d0f60f;
text-align: center;
transition: transform .22s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .25s cubic-bezier(0.4, 0, 0.2, 1);
animation: cascade-in .28s cubic-bezier(0.0, 0, 0.2, 1) both
}

.about-us .cascade-item:nth-child(1) {
animation-delay: .04s
}

.about-us .cascade-item:nth-child(2) {
animation-delay: .1s;
transform-origin: center
}

.about-us .cascade-item:nth-child(3) {
animation-delay: .16s
}

.about-us .cascade-item:nth-child(4) {
animation-delay: .22s;
transform-origin: center
}

@keyframes cascade-in {
from {
opacity: 0;
transform: scale(0.88)
}

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

.about-us .cascade-item:nth-child(2),
.about-us .cascade-item:nth-child(4) {
margin-top: 16px
}

.about-us .cascade-item:hover {
transform: scale(1.03);
box-shadow: 2px 7px 20px 0 #09d0f61c
}

.about-us .cascade-icon {
width: 40px;
height: 40px;
margin: 0 auto 16px
}

.about-us .cascade-label {
font-size: 15px;
line-height: 1.4;
color: #0d1a22;
font-weight: 700;
margin: 0 0 8px
}

.about-us .cascade-text {
font-size: 15px;
line-height: 1.7;
color: #3a5060;
margin: 0
}

@media (max-width: 768px) {
.about-us .bento-grid {
grid-template-columns: 1fr;
padding: 32px 16px;
gap: 16px
}

.about-us .bento-image-cell {
grid-column: 1;
grid-row: auto
}

.about-us .bento-text-cell {
grid-column: 1;
grid-row: auto
}

.about-us .bento-stat-cell.mint,
.about-us .bento-stat-cell.amber {
grid-column: 1;
grid-row: auto
}

.about-us .bento-heading {
font-size: 31px
}

.about-us .bento-heading .first-letter {
font-size: 31px
}

.about-us .depth-top-row {
grid-template-columns: 1fr;
padding-top: 32px
}

.about-us .contrast-block {
grid-template-columns: 1fr
}

.about-us .contrast-before {
border-right: none;
border-bottom: 1px dashed #09d0f666
}

.about-us .depth-bottom-row {
grid-template-columns: 1fr
}

.about-us .cert-block {
grid-column: 1
}

.about-us .cascade-grid {
grid-template-columns: 1fr 1fr
}

.about-us .cascade-item:nth-child(2),
.about-us .cascade-item:nth-child(4) {
margin-top: 0
}
}

@media (min-width: 769px) and (max-width: 1280px) {
.about-us .bento-grid {
grid-template-columns: 1.2fr 1fr 1fr;
padding: 48px 24px
}

.about-us .depth-bottom-row {
grid-template-columns: 1fr 1fr
}

.about-us .cert-block {
grid-column: 1 / 3
}

.about-us .cascade-grid {
grid-template-columns: repeat(2, 1fr)
}

.about-us .cascade-item:nth-child(2),
.about-us .cascade-item:nth-child(4) {
margin-top: 0
}
}

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

.services .page-limit {
max-width: 1320px;
margin-left: auto;
margin-right: auto;
padding-left: 32px;
padding-right: 32px
}

.services ::selection {
background: #09D0F6;
color: #111
}

.services .sweep-heading {
display: inline-block;
background: linear-gradient(90deg, #222 0%, #222 40%, #09D0F6 50%, #222 60%, #222 100%);
background-size: 200% auto;
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
animation: sweep 1.8s cubic-bezier(0.4, 0, 0.2, 1) .2s both
}

@keyframes sweep {
0% {
background-position: 100% center
}

100% {
background-position: 0 center
}
}

.services .accent-first::first-letter {
color: #09D0F6;
font-size: 19px
}

.services .thin-line {
display: block;
width: 48px;
height: 2px;
background: linear-gradient(to right, #09D0F6, #F7A411);
margin: 8px auto 16px;
border-radius: 2px
}

.services .shape-anchor {
display: inline-block;
width: 10px;
height: 10px;
background: #F7A411;
border-radius: 2px;
margin-right: 8px;
vertical-align: middle;
flex-shrink: 0
}

input[type="text"],
input[type="email"],
textarea,
select {
font-style: italic;
opacity: .55
}

.services .btn-primary {
display: inline-block;
padding: 16px 32px;
background: linear-gradient(to top, #09D0F6, #DBFBE7);
color: #111;
font-size: 15px;
font-weight: 700;
border: none;
border-radius: 9px;
cursor: pointer;
box-shadow: 2px 7px 20px 0 #09d0f61c;
transition: box-shadow .22s cubic-bezier(0.4, 0, 0.2, 1), background .26s cubic-bezier(0.0, 0, 0.2, 1);
text-decoration: none;
letter-spacing: .02em;
line-height: 1.4
}

.services .btn-primary:hover {
box-shadow: 2px 9px 40px 0 #09d0f621;
background: linear-gradient(to top, #F7A411, #09D0F6);
color: #111
}

.services .btn-primary:focus {
outline: 2px solid #09D0F6;
outline-offset: 4px
}

.services .btn-primary:active {
box-shadow: 2px 2px 2px 0 #09d0f60f
}

.services .title-block {
padding-top: 64px;
padding-bottom: 64px
}

.services .title-image-strip {
width: 100%;
height: 220px;
border-radius: 16px 16px 5px 5px;
overflow: hidden;
box-shadow: 2px 9px 40px 0 #09d0f621;
margin-bottom: 0;
position: relative
}

.services .title-image-strip img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center 30%;
display: block;
filter: brightness(1.08) saturate(1.1)
}

.services .title-image-strip::after {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(to bottom, #09d0f614, #ffffff2e);
pointer-events: none
}

.services .title-text-zone {
background: linear-gradient(to top, #DBFBE7 0%, #fff 100%);
border-radius: 5px 5px 16px 16px;
padding: 40px 64px 48px;
position: relative
}

.services .title-text-zone::before {
content: "";
position: absolute;
top: -1px;
left: 10%;
width: 80%;
height: 1px;
background: linear-gradient(to right, transparent, #09D0F6, transparent)
}

.services .title-deco {
position: absolute;
bottom: 24px;
right: 32px;
width: 120px;
height: 120px;
border-radius: 50%;
background: radial-gradient(circle at 60% 40%, #09d0f621, transparent 70%);
pointer-events: none
}

.services .title-text-zone h1 {
font-size: 70px;
line-height: 1.1;
letter-spacing: -.03em;
color: #111;
margin-bottom: 16px;
text-align: center
}

.services .title-text-zone .subtitle {
font-size: 19px;
line-height: 1.7;
color: #333;
text-align: center;
max-width: 680px;
margin: 0 auto 24px
}

.services .title-theses {
display: flex;
flex-direction: row;
gap: 32px;
justify-content: center;
flex-wrap: wrap;
margin-top: 24px
}

.services .thesis-item {
display: flex;
flex-direction: row;
align-items: center;
gap: 8px;
font-size: 15px;
line-height: 1.4;
color: #333
}

.services .detail-section {
background: #111;
padding-top: 64px;
padding-bottom: 64px;
position: relative
}

.services .detail-section::before {
content: "";
display: block;
height: 40px;
background: linear-gradient(to bottom right, #fff 50%, #111 50%);
margin-bottom: 0;
position: absolute;
top: -40px;
left: 0;
right: 0;
pointer-events: none
}

.services .detail-section::after {
content: "";
display: block;
height: 40px;
background: linear-gradient(to bottom right, #111 50%, #fff 50%);
position: absolute;
bottom: -40px;
left: 0;
right: 0;
pointer-events: none
}

.services .detail-section h2 {
font-size: 31px;
line-height: 1.1;
letter-spacing: -.01em;
color: #fff;
text-align: center;
margin-bottom: 8px
}

.services .detail-section .thin-line {
margin: 8px auto 32px
}

.services .services-split {
display: grid;
grid-template-columns: 60fr 40fr;
gap: 32px;
align-items: start;
margin-top: 32px
}

.services .service-list-col {
display: flex;
flex-direction: column;
gap: 24px
}

.services .service-card {
background: #ffffff0a;
border: 1px solid #09d0f62e;
border-radius: 9px;
padding: 24px;
box-shadow: 2px 7px 20px 0 #09d0f61c;
transition: border-color .24s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .22s cubic-bezier(0.4, 0, 0.2, 1)
}

.services .service-card:hover {
border-color: #09d0f680;
box-shadow: 2px 9px 40px 0 #09d0f621
}

.services .service-card h3 {
font-size: 19px;
line-height: 1.4;
color: #09D0F6;
margin-bottom: 8px;
display: flex;
flex-direction: row;
align-items: center;
gap: 8px
}

.services .service-card p {
font-size: 15px;
line-height: 1.7;
color: #ffffffd1;
margin: 0
}

.services .sidebar-col {
display: flex;
flex-direction: column;
gap: 16px
}

.services .sidebar-label {
display: flex;
flex-direction: row;
align-items: flex-start;
gap: 16px;
padding: 16px;
background: #ffffff0f;
border-radius: 9px;
border: 1px solid #f7a41133
}

.services .sidebar-label .label-icon {
flex-shrink: 0;
width: 36px;
height: 36px;
background: linear-gradient(to top, #F7A411, #DBFBE7);
border-radius: 5px;
display: flex;
align-items: center;
justify-content: center
}

.services .sidebar-label .label-icon svg {
width: 18px;
height: 18px
}

.services .sidebar-label .label-text {
font-size: 15px;
line-height: 1.4;
color: #ffffffe0
}

.services .sidebar-label .label-text strong {
display: block;
color: #F7A411;
margin-bottom: 4px
}

.services .approach-section {
padding-top: 104px;
padding-bottom: 64px
}

.services .approach-section h2 {
font-size: 31px;
line-height: 1.1;
letter-spacing: -.01em;
color: #111;
text-align: center;
margin-bottom: 8px
}

.services .approach-grid {
display: grid;
grid-template-columns: 40fr 60fr;
gap: 64px;
align-items: start;
margin-top: 40px
}

.services .approach-metrics {
display: flex;
flex-direction: column;
gap: 16px
}

.services .metric-row {
display: flex;
flex-direction: row;
align-items: center;
gap: 16px;
background: linear-gradient(to top, #DBFBE7 0%, #fff 100%);
border-radius: 9px;
padding: 16px 24px;
box-shadow: 2px 7px 20px 0 #dbfbe71c
}

.services .metric-number {
font-size: 31px;
line-height: 1.1;
font-weight: 800;
color: #09D0F6;
letter-spacing: -.02em;
min-width: 64px
}

.services .metric-desc {
font-size: 15px;
line-height: 1.4;
color: #333
}

.services .approach-text-col {
display: flex;
flex-direction: column;
gap: 24px
}

.services .approach-text-col p {
font-size: 15px;
line-height: 1.7;
color: #333;
margin: 0
}

.services .testimonial-card {
background: linear-gradient(to top, #09D0F6 0%, #DBFBE7 100%);
border-radius: 16px;
padding: 24px;
display: flex;
flex-direction: row;
gap: 16px;
align-items: flex-start;
box-shadow: 2px 9px 40px 0 #09d0f621;
margin-top: 8px
}

.services .testimonial-portrait {
width: 80px;
height: 120px;
border-radius: 24px;
overflow: hidden;
flex-shrink: 0;
box-shadow: 2px 7px 20px 0 #09d0f61c
}

.services .testimonial-portrait img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: top;
display: block
}

.services .testimonial-body {
display: flex;
flex-direction: column;
gap: 8px
}

.services .testimonial-body blockquote {
font-size: 15px;
line-height: 1.7;
color: #111;
margin: 0;
font-style: italic
}

.services .testimonial-body cite {
font-size: 15px;
font-weight: 700;
color: #111;
font-style: normal
}

.services .cta-row {
display: flex;
flex-direction: row;
justify-content: center;
margin-top: 40px
}

@media (max-width: 1280px) {
.services .title-text-zone {
padding: 32px 32px 40px
}

.services .title-text-zone h1 {
font-size: 70px
}

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

.services .approach-grid {
grid-template-columns: 1fr;
gap: 32px
}
}

@media (max-width: 768px) {
.services .page-limit {
padding-left: 16px;
padding-right: 16px
}

.services .title-text-zone h1 {
font-size: 31px
}

.services .title-text-zone {
padding: 24px 16px 32px
}

.services .title-theses {
flex-direction: column;
gap: 16px
}

.services .title-image-strip {
height: 140px
}

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

.services .approach-grid {
grid-template-columns: 1fr;
gap: 24px
}

.services .testimonial-card {
flex-direction: column
}

.services .testimonial-portrait {
width: 64px;
height: 96px
}
}

.success-page {
min-height: 60vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 64px 16px;
background: linear-gradient(to top, #09D0F6 0%, #fff 100%)
}

.success-page .success-card {
background: #fff;
border-radius: 16px;
box-shadow: 2px 9px 40px 0 #09d0f621;
padding: 64px 32px;
max-width: 560px;
width: 100%;
text-align: center
}

.success-page .success-icon-wrap {
width: 72px;
height: 72px;
margin: 0 auto 32px;
border-radius: 50%;
background: #DBFBE7;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
box-shadow: 2px 7px 20px 0 #09d0f61c
}

.success-page .success-icon-wrap svg {
display: block
}

.success-page .success-heading {
font-size: 31px;
line-height: 1.1;
letter-spacing: -.02em;
color: #0d2d36;
margin: 0 0 16px
}

.success-page .success-heading .success-first-letter {
font-size: 38px;
color: #09D0F6
}

.success-page .success-body {
font-size: 15px;
line-height: 1.7;
color: #1e4a55;
margin: 0 0 32px
}

.success-page .success-divider {
width: 48px;
height: 3px;
background: linear-gradient(to top, #09D0F6, #fff);
border-radius: 2px;
margin: 0 auto 32px
}

.success-page .success-meta {
font-size: 15px;
line-height: 1.4;
color: #2e6b7a;
margin: 0 0 32px
}

.success-page .success-link {
display: inline-block;
padding: 16px 32px;
border-radius: 9px;
font-size: 15px;
line-height: 1.1;
font-weight: 600;
color: #0d2d36;
background: linear-gradient(to top, #F7A411, #f7c411);
text-decoration: none;
box-shadow: 2px 2px 2px 0 #09d0f60f;
transition: box-shadow .22s cubic-bezier(0.4, 0, 0.2, 1), background .25s cubic-bezier(0.0, 0, 0.2, 1);
border: none
}

.success-page .success-link:hover {
box-shadow: 2px 7px 20px 0 #09d0f61c;
background: linear-gradient(to top, #e8960a, #f7b811)
}

.success-page .success-link:focus {
outline: 2px solid #09D0F6;
outline-offset: 4px
}

@media (max-width: 768px) {
.success-page .success-card {
padding: 32px 16px
}

.success-page .success-heading {
font-size: 31px
}
}