@import "https://cdn.jsdelivr.net/npm/@fontsource/open-sans@latest/400.css";
@import "https://cdn.jsdelivr.net/npm/@fontsource/open-sans@latest/700.css";

*,
::before,
::after {
box-sizing: border-box
}

body {
margin: 0;
-webkit-text-size-adjust: 100%
}

.top-bar {
background: linear-gradient(135deg, #00304A 0%, #004060 100%);
padding: 8px 0;
position: relative;
z-index: 100
}

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

.contact-item {
display: flex;
align-items: center;
gap: 8px;
font-family: 'Open Sans', sans-serif;
font-size: 16px;
color: #DFE6E2;
text-decoration: none;
transition: color .12s ease-out
}

.contact-item:hover {
color: #FD68BB
}

.contact-item:focus {
outline: none;
position: relative
}

.contact-item:focus::before {
content: 'focused';
position: absolute;
top: -18px;
left: 0;
font-size: 16px;
color: #FD68BB;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .5px
}

.contact-icon {
width: 18px;
height: 18px;
background: #FD68BB;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
color: #00304A;
flex-shrink: 0
}

.main-header {
background: linear-gradient(180deg, #DFE6E2 0%, #dfe6e2d9 100%);
padding: 24px 0;
position: relative;
z-index: 90;
box-shadow: 0 4px 25px 0 #00304a14
}

.logo-row {
max-width: 1024px;
margin: 0 auto;
padding: 0 24px;
display: flex;
justify-content: center;
margin-bottom: 24px
}

.logo-container {
width: 56px;
height: 56px;
border: 3px solid #00304A;
border-radius: 14px;
padding: 4px;
background: #fff;
box-shadow: 0 4px 25px 0 #00304a14;
transition: transform .1s ease-out
}

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

.logo-container:focus {
outline: none;
position: relative
}

.logo-container:focus::before {
content: 'logo';
position: absolute;
top: -22px;
left: 50%;
transform: translateX(-50%);
font-size: 16px;
color: #00304A;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .5px;
font-family: 'Open Sans', sans-serif
}

.brand-mark {
width: 100%;
height: 100%;
object-fit: contain
}

.nav-row {
max-width: 1024px;
margin: 0 auto;
padding: 0 24px;
display: flex;
justify-content: center
}

.primary-nav {
display: flex;
gap: 16px;
flex-wrap: wrap;
justify-content: center;
align-items: center
}

.nav-link {
font-family: 'Open Sans', sans-serif;
font-size: 18px;
font-weight: 700;
color: #00304A;
text-decoration: none;
padding: 16px 24px;
border-radius: 14px;
background: #fff;
box-shadow: 0 3px 3px 0 #00304a12;
transition: background .11s ease-out, box-shadow .11s ease-out;
position: relative;
min-height: 44px;
display: flex;
align-items: center
}

.nav-link:hover {
background: linear-gradient(135deg, #FD68BB 0%, #ff7cc5 100%);
color: #fff;
box-shadow: 0 9px 60px 0 #fd68bb1c
}

.nav-link:focus {
outline: none;
background: #FD68BB;
color: #fff
}

.nav-link:focus::before {
content: 'selected';
position: absolute;
top: -20px;
left: 50%;
transform: translateX(-50%);
font-size: 16px;
color: #00304A;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .5px;
white-space: nowrap
}

.site-footer {
background: linear-gradient(180deg, #FD68BB 0%, #ff85c9 100%);
padding: 64px 0 32px;
position: relative;
margin-top: 64px
}

.footer-content {
max-width: 1024px;
margin: 0 auto;
padding: 0 24px
}

.footer-columns {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 64px;
margin-bottom: 64px
}

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

.footer-heading {
font-family: 'Open Sans', sans-serif;
font-size: 22px;
font-weight: 700;
color: #00304A;
line-height: 1.2;
letter-spacing: -.3px;
margin: 0
}

.footer-text {
font-family: 'Open Sans', sans-serif;
font-size: 16px;
color: #00304A;
line-height: 1.8;
margin: 0
}

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

.footer-link {
font-family: 'Open Sans', sans-serif;
font-size: 16px;
color: #00304A;
text-decoration: none;
transition: color .09s ease-out;
display: inline-block;
position: relative
}

.footer-link:hover {
color: #fff
}

.footer-link:focus {
outline: none;
color: #fff
}

.footer-link:focus::before {
content: 'link';
position: absolute;
top: -18px;
left: 0;
font-size: 16px;
color: #00304A;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .5px
}

.contact-detail {
font-family: 'Open Sans', sans-serif;
font-size: 16px;
color: #00304A;
line-height: 1.8;
margin: 0;
display: flex;
align-items: flex-start;
gap: 8px
}

.contact-detail-icon {
width: 20px;
height: 20px;
background: #00304A;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
color: #FD68BB;
flex-shrink: 0;
margin-top: 2px
}

.contact-detail a {
color: #00304A;
text-decoration: none;
transition: color .09s ease-out
}

.contact-detail a:hover {
color: #fff
}

.contact-detail a:focus {
outline: none;
color: #fff;
position: relative
}

.contact-detail a:focus::before {
content: 'active';
position: absolute;
top: -18px;
left: 0;
font-size: 16px;
color: #00304A;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .5px
}

.footer-logo-box {
display: flex;
justify-content: center;
margin-bottom: 32px
}

.footer-logo-wrap {
width: 56px;
height: 56px;
border: 3px solid #00304A;
border-radius: 14px;
padding: 4px;
background: #fff;
box-shadow: 0 4px 25px 0 #00304a14
}

.footer-brand-mark {
width: 100%;
height: 100%;
object-fit: contain
}

.copyright-box {
text-align: center;
padding-top: 32px;
border-top: 2px solid #00304a33
}

.copyright-text {
font-family: 'Open Sans', sans-serif;
font-size: 16px;
color: #00304A;
line-height: 1.8;
margin: 0
}

.consent-popup {
position: fixed;
bottom: 24px;
right: 24px;
width: 420px;
max-width: calc(100vw - 48px);
background: #fff;
border-radius: 22px;
box-shadow: 0 9px 60px 0 #00304a1c;
padding: 32px;
z-index: 1200;
display: none;
transform: translateX(500px);
transition: transform .26s ease-out
}

.consent-popup.visible {
transform: translateX(0)
}

.consent-head {
font-family: 'Open Sans', sans-serif;
font-size: 22px;
font-weight: 700;
color: #00304A;
line-height: 1.2;
letter-spacing: -.3px;
margin: 0 0 16px
}

.consent-desc {
font-family: 'Open Sans', sans-serif;
font-size: 16px;
color: #00304A;
line-height: 1.8;
margin: 0 0 24px
}

.consent-actions {
display: flex;
gap: 16px;
margin-bottom: 16px
}

.consent-btn-primary {
flex: 1;
font-family: 'Open Sans', sans-serif;
font-size: 18px;
font-weight: 700;
color: #fff;
background: linear-gradient(135deg, #FD68BB 0%, #ff7cc5 100%);
border: none;
border-radius: 14px;
padding: 16px 24px;
cursor: pointer;
transition: filter .11s ease-out;
min-height: 44px
}

.consent-btn-primary:hover {
filter: brightness(1.1)
}

.consent-btn-primary:focus {
outline: none;
filter: brightness(1.15);
position: relative
}

.consent-btn-primary:focus::before {
content: 'focused';
position: absolute;
top: -20px;
left: 50%;
transform: translateX(-50%);
font-size: 16px;
color: #00304A;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .5px;
white-space: nowrap
}

.consent-btn-secondary {
flex: 1;
font-family: 'Open Sans', sans-serif;
font-size: 16px;
font-weight: 700;
color: #00304A;
background: #DFE6E2;
border: none;
border-radius: 14px;
padding: 16px 24px;
cursor: pointer;
transition: background .11s ease-out;
min-height: 44px
}

.consent-btn-secondary:hover {
background: #d0d9d5
}

.consent-btn-secondary:focus {
outline: none;
background: #c5cec9;
position: relative
}

.consent-btn-secondary:focus::before {
content: 'focused';
position: absolute;
top: -20px;
left: 50%;
transform: translateX(-50%);
font-size: 16px;
color: #00304A;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .5px;
white-space: nowrap
}

.consent-toggle-trigger {
font-family: 'Open Sans', sans-serif;
font-size: 16px;
font-weight: 700;
color: #00304A;
background: transparent;
border: none;
padding: 8px 0;
cursor: pointer;
text-decoration: underline;
transition: color .09s ease-out;
text-align: left
}

.consent-toggle-trigger:hover {
color: #FD68BB
}

.consent-toggle-trigger:focus {
outline: none;
color: #FD68BB;
position: relative
}

.consent-toggle-trigger:focus::before {
content: 'focused';
position: absolute;
top: -18px;
left: 0;
font-size: 16px;
color: #00304A;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .5px
}

.consent-panel {
display: none;
margin-top: 16px;
padding: 16px;
background: #DFE6E2;
border-radius: 14px
}

.consent-panel.expanded {
display: block
}

.consent-option {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 16px
}

.consent-option:last-child {
margin-bottom: 0
}

.consent-checkbox {
width: 20px;
height: 20px;
cursor: pointer;
accent-color: #FD68BB
}

.consent-label {
font-family: 'Open Sans', sans-serif;
font-size: 16px;
color: #00304A;
line-height: 1.8;
cursor: pointer
}

@media (max-width: 960px) {
.top-bar-inner {
flex-direction: column;
gap: 16px
}

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

.consent-popup {
width: 360px
}
}

@media (max-width: 480px) {
.top-bar-inner {
padding: 0 16px
}

.logo-row {
padding: 0 16px
}

.nav-row {
padding: 0 16px
}

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

.nav-link {
width: 100%;
justify-content: center
}

.footer-content {
padding: 0 16px
}

.consent-popup {
width: calc(100vw - 32px);
right: 16px;
bottom: 16px;
padding: 24px
}

.consent-actions {
flex-direction: column
}
}

.doc-inner {
max-width: 1024px;
margin: 0 auto;
padding: 64px 24px
}

.doc-inner p {
font-size: 16px;
line-height: 1.8;
color: #00304A;
margin: 0 0 16px
}

.doc-inner p:last-child {
margin-bottom: 0
}

.doc-inner ul,
.doc-inner ol {
margin: 0 0 24px;
padding-left: 32px
}

.doc-inner li {
font-size: 16px;
line-height: 1.8;
color: #00304A;
margin-bottom: 8px
}

.doc-inner li:last-child {
margin-bottom: 0
}

.doc-inner em,
.doc-inner i {
font-style: italic;
color: #00304A
}

.doc-inner table {
width: 100%;
border-collapse: collapse;
margin: 0 0 32px;
background: #fff;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 3px 3px 0 #fd68bb12
}

.doc-inner thead {
background: #DFE6E2
}

.doc-inner th {
font-size: 16px;
line-height: 1.2;
color: #00304A;
text-align: left;
padding: 16px;
font-weight: 600
}

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

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

.doc-inner td {
font-size: 16px;
line-height: 1.8;
color: #00304A;
padding: 16px
}

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

.doc-inner div:last-child {
margin-bottom: 0
}

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

.doc-inner table {
display: block;
overflow-x: auto;
-webkit-overflow-scrolling: touch
}
}

@media (max-width: 480px) {
.doc-inner {
padding: 24px 16px
}

.doc-inner th,
.doc-inner td {
padding: 8px;
font-size: 16px
}

.doc-inner ul,
.doc-inner ol {
padding-left: 24px
}
}

.about-motion {
background: #fff;
max-width: 1024px;
margin: 0 auto;
padding: 0
}

.about-motion .lead-banner {
background: #00304A;
padding: 64px 32px;
position: relative;
overflow: hidden
}

.about-motion .lead-banner::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 4px;
height: calc(100% - 32px);
background: #FD68BB;
margin-top: 16px
}

.about-motion .lead-banner::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: calc(100% - 32px);
height: 4px;
background: #FD68BB;
margin-left: 16px
}

.about-motion .lead-content {
max-width: 720px;
margin: 0 auto;
color: #fff;
animation: elastic-entry .68s cubic-bezier(0.68, -0.55, 0.265, 1.55)
}

@keyframes elastic-entry {
0% {
opacity: 0;
transform: scale(0.85) translateY(24px)
}

60% {
transform: scale(1.04) translateY(-4px)
}

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

.about-motion .lead-label {
font-size: 16px;
line-height: 1.8;
color: #DFE6E2;
margin: 0 0 16px;
letter-spacing: .05em;
text-transform: uppercase
}

.about-motion .lead-title {
font-size: 72px;
line-height: 1.2;
margin: 0 0 24px;
letter-spacing: -.02em;
font-weight: 700
}

.about-motion .lead-description {
font-size: 22px;
line-height: 1.8;
color: #DFE6E2;
margin: 0
}

.about-motion .divider-curve-one {
width: 100%;
height: 64px;
display: block
}

.about-motion .story-segment {
padding: 64px 32px;
background: linear-gradient(323deg, #00304A 0%, #DFE6E2 100%);
position: relative;
overflow: hidden
}

.about-motion .story-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 64px;
max-width: 960px;
margin: 0 auto;
align-items: start
}

.about-motion .story-text {
animation: slide-in-left .82s ease-out
}

@keyframes slide-in-left {
0% {
opacity: 0;
transform: translateX(-48px)
}

100% {
opacity: 1;
transform: translateX(0)
}
}

.about-motion .story-heading {
font-size: 40px;
line-height: 1.2;
margin: 0 0 24px;
color: #00304A;
letter-spacing: -.01em;
font-weight: 700;
position: relative;
display: inline-block
}

.about-motion .story-heading::after {
content: '';
width: 8px;
height: 8px;
background: #FD68BB;
border-radius: 14px;
display: inline-block;
margin-left: 8px;
vertical-align: middle;
position: relative;
top: -4px
}

.about-motion .story-paragraph {
font-size: 18px;
line-height: 1.8;
color: #00304A;
margin: 0 0 24px
}

.about-motion .story-paragraph:last-child {
margin-bottom: 0
}

.about-motion .story-visual {
position: relative;
animation: slide-in-right .82s ease-out
}

@keyframes slide-in-right {
0% {
opacity: 0;
transform: translateX(48px)
}

100% {
opacity: 1;
transform: translateX(0)
}
}

.about-motion .story-image-wrapper {
width: 100%;
height: 440px;
border-radius: 22px;
overflow: hidden;
box-shadow: 0 9px 60px 0 #00304a1c;
position: relative
}

.about-motion .story-image {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
display: block;
transition: transform .12s ease-out
}

.about-motion .story-image-wrapper::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #00304ad9;
opacity: 0;
transition: opacity .15s ease-out;
z-index: 2;
pointer-events: none
}

.about-motion .story-image-wrapper:hover::before {
opacity: 1
}

.about-motion .story-image-wrapper:hover .story-image {
transform: scale(1.05)
}

.about-motion .divider-curve-two {
width: 100%;
height: 64px;
display: block;
transform: scaleX(-1)
}

.about-motion .approach-zone {
padding: 64px 32px;
background: #fff;
position: relative
}

.about-motion .approach-container {
max-width: 960px;
margin: 0 auto
}

.about-motion .approach-intro {
margin-bottom: 64px;
animation: fade-up .76s ease-out
}

@keyframes fade-up {
0% {
opacity: 0;
transform: translateY(32px)
}

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

.about-motion .approach-title {
font-size: 40px;
line-height: 1.2;
margin: 0 0 24px;
color: #00304A;
letter-spacing: -.01em;
font-weight: 700;
max-width: 640px
}

.about-motion .approach-summary {
font-size: 18px;
line-height: 1.8;
color: #00304A;
margin: 0;
max-width: 720px
}

.about-motion .approach-layout {
display: grid;
grid-template-columns: 1.2fr 1fr;
gap: 64px;
align-items: start
}

.about-motion .feature-stack {
display: flex;
flex-direction: column;
gap: 32px;
animation: stagger-in .88s ease-out
}

@keyframes stagger-in {
0% {
opacity: 0;
transform: translateY(24px)
}

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

.about-motion .feature-card {
background: #fff;
border: 1px solid #DFE6E2;
border-radius: 8px;
padding: 24px;
box-shadow: 0 3px 3px 0 #00304a12;
transition: box-shadow .11s ease-out, transform .11s ease-out;
position: relative;
overflow: hidden
}

.about-motion .feature-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 0;
height: 100%;
background: linear-gradient(323deg, #FD68BB 0%, #DFE6E2 100%);
transition: width .14s ease-out;
z-index: 1
}

.about-motion .feature-card:hover::before {
width: 6px
}

.about-motion .feature-card:hover {
box-shadow: 0 9px 60px 0 #fd68bb1c;
transform: translateX(4px)
}

.about-motion .feature-card-content {
position: relative;
z-index: 2
}

.about-motion .feature-heading {
font-size: 22px;
line-height: 1.2;
margin: 0 0 16px;
color: #00304A;
font-weight: 700;
position: relative;
display: inline-block
}

.about-motion .feature-heading::after {
content: '';
width: 6px;
height: 6px;
background: #FD68BB;
border-radius: 14px;
display: inline-block;
margin-left: 8px;
vertical-align: middle;
position: relative;
top: -2px
}

.about-motion .feature-text {
font-size: 16px;
line-height: 1.8;
color: #00304A;
margin: 0
}

.about-motion .preview-panel {
position: relative;
animation: reveal-overlay .94s ease-out
}

@keyframes reveal-overlay {
0% {
opacity: 0;
transform: scale(0.92)
}

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

.about-motion .preview-wrapper {
background: #00304A;
border-radius: 22px;
padding: 32px;
box-shadow: 0 9px 60px 0 #00304a1c;
position: relative;
overflow: hidden
}

.about-motion .preview-label {
font-size: 16px;
line-height: 1.8;
color: #DFE6E2;
margin: 0 0 24px;
letter-spacing: .05em;
text-transform: uppercase
}

.about-motion .chart-display {
background: #dfe6e214;
border-radius: 8px;
padding: 24px;
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px)
}

.about-motion .chart-svg {
width: 100%;
height: 240px;
display: block
}

.about-motion .chart-line {
fill: none;
stroke: #FD68BB;
stroke-width: 3;
stroke-linecap: round;
stroke-linejoin: round
}

.about-motion .chart-grid {
stroke: #dfe6e233;
stroke-width: 1
}

.about-motion .chart-axis {
stroke: #DFE6E2;
stroke-width: 2
}

.about-motion .chart-label {
fill: #DFE6E2;
font-size: 12px
}

.about-motion .chart-point {
fill: #FD68BB;
transition: r .09s linear
}

.about-motion .chart-point:hover {
r: 7
}

.about-motion .chart-caption {
font-size: 16px;
line-height: 1.8;
color: #DFE6E2;
margin: 16px 0 0;
text-align: center
}

.about-motion .divider-curve-three {
width: 100%;
height: 64px;
display: block
}

.about-motion .team-section {
padding: 64px 32px;
background: #00304A;
position: relative
}

.about-motion .team-section::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(323deg, #fd68bb0f 0%, #dfe6e208 100%);
pointer-events: none
}

.about-motion .team-content {
max-width: 960px;
margin: 0 auto;
position: relative;
z-index: 2
}

.about-motion .team-header {
margin-bottom: 64px;
text-align: center;
animation: fade-in-scale .72s ease-out
}

@keyframes fade-in-scale {
0% {
opacity: 0;
transform: scale(0.94)
}

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

.about-motion .team-title {
font-size: 40px;
line-height: 1.2;
margin: 0 0 24px;
color: #fff;
letter-spacing: -.01em;
font-weight: 700
}

.about-motion .team-description {
font-size: 18px;
line-height: 1.8;
color: #DFE6E2;
margin: 0;
max-width: 640px;
margin-left: auto;
margin-right: auto
}

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

.about-motion .member-card {
background: #ffffff0a;
border: 1px solid #dfe6e21f;
border-radius: 8px;
padding: 24px;
transition: background .12s ease-out, border-color .12s ease-out, transform .12s ease-out;
animation: card-appear .86s ease-out;
animation-fill-mode: both;
position: relative;
overflow: hidden
}

@keyframes card-appear {
0% {
opacity: 0;
transform: translateY(32px)
}

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

.about-motion .member-card:nth-child(1) {
animation-delay: .08s
}

.about-motion .member-card:nth-child(2) {
animation-delay: .16s
}

.about-motion .member-card:nth-child(3) {
animation-delay: .24s
}

.about-motion .member-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 0;
background: linear-gradient(323deg, #FD68BB 0%, #DFE6E2 100%);
opacity: .08;
transition: height .13s ease-out
}

.about-motion .member-card:hover::before {
height: 6px
}

.about-motion .member-card:hover {
background: #ffffff14;
border-color: #fd68bb3d;
transform: translateY(-4px)
}

.about-motion .member-info {
position: relative;
z-index: 2
}

.about-motion .member-photo-wrapper {
width: 100%;
height: 280px;
border-radius: 8px;
overflow: hidden;
margin-bottom: 24px;
position: relative
}

.about-motion .member-photo {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
display: block;
transition: transform .14s ease-out
}

.about-motion .member-photo-wrapper::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #00304ad9;
opacity: 0;
transition: opacity .13s ease-out;
z-index: 2;
pointer-events: none
}

.about-motion .member-photo-wrapper::after {
content: 'View Profile';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #fff;
font-size: 18px;
font-weight: 700;
opacity: 0;
transition: opacity .13s ease-out;
z-index: 3;
pointer-events: none
}

.about-motion .member-photo-wrapper:hover::before,
.about-motion .member-photo-wrapper:hover::after {
opacity: 1
}

.about-motion .member-photo-wrapper:hover .member-photo {
transform: scale(1.08)
}

.about-motion .member-name {
font-size: 22px;
line-height: 1.2;
margin: 0 0 8px;
color: #fff;
font-weight: 700
}

.about-motion .member-role {
font-size: 16px;
line-height: 1.8;
color: #FD68BB;
margin: 0 0 16px
}

.about-motion .member-bio {
font-size: 16px;
line-height: 1.8;
color: #DFE6E2;
margin: 0
}

.about-motion .hidden-content-trigger {
margin-top: 32px;
text-align: center
}

.about-motion .reveal-toggle {
display: none
}

.about-motion .reveal-button {
background: #FD68BB;
color: #fff;
border: none;
border-radius: 8px;
padding: 16px 32px;
font-size: 18px;
font-weight: 700;
cursor: pointer;
transition: filter .11s ease-out, transform .11s ease-out;
box-shadow: 0 4px 25px 0 #fd68bb14
}

.about-motion .reveal-button:hover {
filter: brightness(1.12);
transform: translateY(-2px)
}

.about-motion .reveal-button:active {
transform: translateY(0)
}

.about-motion .hidden-panel {
max-height: 0;
overflow: hidden;
transition: max-height .15s ease-out, opacity .15s ease-out;
opacity: 0;
margin-top: 0
}

.about-motion .reveal-toggle:checked~.hidden-panel {
max-height: 2000px;
opacity: 1 !important;
margin-top: 64px
}

.about-motion .reveal-toggle:checked~.hidden-content-trigger .reveal-button {
display: none
}

.about-motion .milestone-timeline {
background: #ffffff0a;
border: 1px solid #dfe6e21f;
border-radius: 8px;
padding: 32px
}

.about-motion .timeline-heading {
font-size: 28px;
line-height: 1.2;
margin: 0 0 32px;
color: #fff;
font-weight: 700;
text-align: center;
position: relative;
display: inline-block;
width: 100%
}

.about-motion .timeline-heading::after {
content: '';
width: 8px;
height: 8px;
background: #FD68BB;
border-radius: 14px;
display: inline-block;
margin-left: 8px;
vertical-align: middle;
position: relative;
top: -4px
}

.about-motion .timeline-list {
display: flex;
flex-direction: column;
gap: 24px
}

.about-motion .timeline-item {
display: grid;
grid-template-columns: 120px 1fr;
gap: 24px;
align-items: start;
padding: 16px;
background: #ffffff05;
border-radius: 8px;
transition: background .1s linear
}

.about-motion .timeline-item:hover {
background: #ffffff0f
}

.about-motion .timeline-year {
font-size: 28px;
line-height: 1.2;
color: #FD68BB;
font-weight: 700;
margin: 0
}

.about-motion .timeline-event {
font-size: 18px;
line-height: 1.8;
color: #DFE6E2;
margin: 0
}

@media (max-width: 960px) {
.about-motion .lead-title {
font-size: 40px
}

.about-motion .lead-description {
font-size: 18px
}

.about-motion .story-grid {
grid-template-columns: 1fr;
gap: 32px
}

.about-motion .approach-layout {
grid-template-columns: 1fr;
gap: 32px
}

.about-motion .team-grid {
grid-template-columns: 1fr;
gap: 24px
}

.about-motion .timeline-item {
grid-template-columns: 1fr;
gap: 8px
}
}

@media (max-width: 480px) {
.about-motion .lead-banner {
padding: 32px 16px
}

.about-motion .lead-title {
font-size: 28px
}

.about-motion .lead-description {
font-size: 16px
}

.about-motion .story-segment,
.about-motion .approach-zone,
.about-motion .team-section {
padding: 32px 16px
}

.about-motion .story-heading,
.about-motion .approach-title,
.about-motion .team-title {
font-size: 28px
}

.about-motion .story-image-wrapper {
height: 280px
}

.about-motion .member-photo-wrapper {
height: 240px
}

.about-motion .chart-svg {
height: 180px
}
}

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

.frnt .tb-wrap {
display: flex;
flex-direction: row;
align-items: stretch;
gap: 32px;
padding: 64px 24px;
position: relative;
background: linear-gradient(323deg, #00304A 0%, #DFE6E2 100%)
}

.frnt .tb-text {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
gap: 24px;
position: relative;
z-index: 2
}

.frnt .tb-quote {
position: absolute;
top: 32px;
left: 24px;
font-size: 280px;
line-height: 1;
color: #fd68bb14;
font-weight: 700;
z-index: 1;
pointer-events: none
}

.frnt .tb-h1 {
font-size: 72px;
line-height: 1.2;
color: #fff;
margin: 0;
letter-spacing: -.02em
}

.frnt .tb-desc {
font-size: 22px;
line-height: 1.8;
color: #DFE6E2;
margin: 0
}

.frnt .tb-img-strip {
width: 280px;
flex-shrink: 0;
position: relative;
overflow: hidden;
border-radius: 14px
}

.frnt .tb-img-strip img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
display: block
}

.frnt .tb-img-strip::after {
content: '';
position: absolute;
inset: 0;
background: radial-gradient(ellipse at center, transparent 20%, #00304ad9 100%);
pointer-events: none
}

.frnt .instructors-sec {
padding: 64px 24px;
background: #fff;
position: relative
}

.frnt .instructors-sec::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 120px;
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120'%3E%3Cpath d='M0 0v46.29c47.79 22.2 103.59 32.17 158 28 70.36-5.37 136.33-33.31 206.8-37.5 73.84-4.36 147.54 16.88 218.2 35.26 69.27 18 138.3 24.88 209.4 13.08 36.15-6 69.85-17.84 104.45-29.34C989.49 25 1113-14.29 1200 52.47V0z' fill='%23DFE6E2' fill-opacity='1'/%3E%3C/svg%3E") no-repeat center top;
background-size: cover;
pointer-events: none
}

.frnt .instructors-inner {
max-width: 960px;
margin: 0 auto
}

.frnt .instructors-h2 {
font-size: 40px;
line-height: 1.2;
color: #00304A;
margin: 0 0 8px;
letter-spacing: -.01em
}

.frnt .instructors-h2::after {
content: '';
display: inline-block;
width: 8px;
height: 8px;
background: #FD68BB;
border-radius: 1px;
margin-left: 8px;
transform: translateY(-12px)
}

.frnt .instructors-intro {
font-size: 18px;
line-height: 1.8;
color: #00304A;
margin: 0 0 32px;
max-width: 720px
}

.frnt .instructors-grid {
display: grid;
grid-template-columns: 2fr 1.5fr 1fr;
gap: 24px
}

.frnt .instructor-card {
background: #fff;
border-radius: 14px;
overflow: hidden;
box-shadow: 0 4px 25px 0 #fd68bb14;
transition: transform .12s ease-out, box-shadow .12s ease-out;
display: flex;
flex-direction: column
}

.frnt .instructor-card:hover {
transform: translateY(-4px);
box-shadow: 0 9px 60px 0 #fd68bb1c
}

.frnt .instructor-img {
width: 100%;
height: 280px;
overflow: hidden;
position: relative
}

.frnt .instructor-img img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
display: block;
filter: brightness(0.92) saturate(1.1)
}

.frnt .instructor-info {
padding: 24px;
flex: 1;
display: flex;
flex-direction: column;
gap: 8px
}

.frnt .instructor-name {
font-size: 22px;
line-height: 1.2;
color: #00304A;
margin: 0;
font-weight: 600
}

.frnt .instructor-role {
font-size: 16px;
line-height: 1.8;
color: #00304A;
margin: 0;
opacity: .7
}

.frnt .instructor-bio {
font-size: 16px;
line-height: 1.8;
color: #00304A;
margin: 8px 0 0
}

.frnt .conditions-sec {
padding: 64px 24px;
background: #FD68BB;
position: relative;
overflow: hidden
}

.frnt .conditions-sec::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: linear-gradient(30deg, #00304a08 12%, transparent 12.5%, transparent 87%, #00304a08 87.5%, #00304a08), linear-gradient(150deg, #00304a08 12%, transparent 12.5%, transparent 87%, #00304a08 87.5%, #00304a08), linear-gradient(30deg, #00304a08 12%, transparent 12.5%, transparent 87%, #00304a08 87.5%, #00304a08), linear-gradient(150deg, #00304a08 12%, transparent 12.5%, transparent 87%, #00304a08 87.5%, #00304a08), linear-gradient(60deg, #00304a05 25%, transparent 25.5%, transparent 75%, #00304a05 75%, #00304a05), linear-gradient(60deg, #00304a05 25%, transparent 25.5%, transparent 75%, #00304a05 75%, #00304a05);
background-size: 80px 140px;
background-position: 0 0, 0 0, 40px 70px, 40px 70px, 0 0, 40px 70px;
pointer-events: none
}

.frnt .conditions-inner {
max-width: 960px;
margin: 0 auto;
position: relative;
z-index: 2
}

.frnt .conditions-h2 {
font-size: 40px;
line-height: 1.2;
color: #fff;
margin: 0 0 32px;
letter-spacing: -.01em
}

.frnt .conditions-h2::after {
content: '';
display: inline-block;
width: 8px;
height: 8px;
background: #00304A;
border-radius: 1px;
margin-left: 8px;
transform: translateY(-12px)
}

.frnt .conditions-layout {
display: flex;
flex-direction: row;
gap: 32px;
align-items: flex-start
}

.frnt .conditions-content {
flex: 1;
display: flex;
flex-direction: column;
gap: 24px
}

.frnt .condition-item {
background: #fffffff2;
border-radius: 14px;
padding: 24px;
box-shadow: 0 3px 3px 0 #00304a12;
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px)
}

.frnt .condition-h3 {
font-size: 22px;
line-height: 1.2;
color: #00304A;
margin: 0 0 8px;
font-weight: 600
}

.frnt .condition-text {
font-size: 16px;
line-height: 1.8;
color: #00304A;
margin: 0
}

.frnt .conditions-img-box {
width: 360px;
flex-shrink: 0;
border-radius: 14px;
overflow: hidden;
box-shadow: 0 9px 60px 0 #00304a1c;
position: relative;
transform: translateY(32px)
}

.frnt .conditions-img-box img {
width: 100%;
height: 480px;
object-fit: cover;
object-position: center;
display: block
}

.frnt .experience-sec {
padding: 64px 24px;
background: #fff;
position: relative
}

.frnt .experience-inner {
max-width: 960px;
margin: 0 auto
}

.frnt .experience-h2 {
font-size: 40px;
line-height: 1.2;
color: #00304A;
margin: 0 0 8px;
letter-spacing: -.01em
}

.frnt .experience-h2::after {
content: '';
display: inline-block;
width: 8px;
height: 8px;
background: #FD68BB;
border-radius: 1px;
margin-left: 8px;
transform: translateY(-12px)
}

.frnt .experience-intro {
font-size: 18px;
line-height: 1.8;
color: #00304A;
margin: 0 0 32px;
max-width: 720px
}

.frnt .testimonial-wrap {
background: linear-gradient(323deg, #DFE6E2 0%, #fff 100%);
border-radius: 22px;
padding: 32px;
box-shadow: 0 4px 25px 0 #00304a14;
display: flex;
flex-direction: row;
gap: 32px;
align-items: center
}

.frnt .testimonial-photo {
width: 160px;
height: 160px;
border-radius: 22px;
overflow: hidden;
flex-shrink: 0;
box-shadow: 0 3px 3px 0 #fd68bb12
}

.frnt .testimonial-photo img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
display: block
}

.frnt .testimonial-content {
flex: 1;
display: flex;
flex-direction: column;
gap: 16px
}

.frnt .testimonial-quote {
font-size: 18px;
line-height: 1.8;
color: #00304A;
margin: 0;
font-style: italic;
position: relative;
padding-left: 24px
}

.frnt .testimonial-quote::before {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 4px;
background: #FD68BB;
border-radius: 1px
}

.frnt .testimonial-author {
display: flex;
flex-direction: column;
gap: 4px
}

.frnt .testimonial-name {
font-size: 18px;
line-height: 1.2;
color: #00304A;
margin: 0;
font-weight: 600
}

.frnt .testimonial-context {
font-size: 16px;
line-height: 1.8;
color: #00304A;
margin: 0;
opacity: .7
}

.frnt .journey-sec {
padding: 64px 24px;
background: #00304A;
position: relative;
overflow: hidden
}

.frnt .journey-sec::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 120px;
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120'%3E%3Cpath d='M321.39 56.44c58-10.79 114.16-30.13 172-41.86 82.39-16.72 168.19-17.73 250.45-.39C823.78 31 906.67 72 985.66 92.83c70.05 18.48 146.53 26.09 214.34 3V0H0v27.35a600.21 600.21 0 00321.39 29.09z' fill='%23ffffff' fill-opacity='1'/%3E%3C/svg%3E") no-repeat center top;
background-size: cover;
pointer-events: none
}

.frnt .journey-inner {
max-width: 960px;
margin: 0 auto;
position: relative;
z-index: 2
}

.frnt .journey-h2 {
font-size: 40px;
line-height: 1.2;
color: #fff;
margin: 0 0 32px;
letter-spacing: -.01em;
text-align: center
}

.frnt .journey-h2::after {
content: '';
display: inline-block;
width: 8px;
height: 8px;
background: #FD68BB;
border-radius: 1px;
margin-left: 8px;
transform: translateY(-12px)
}

.frnt .journey-timeline {
display: flex;
flex-direction: column;
gap: 32px;
position: relative
}

.frnt .journey-phase {
display: flex;
flex-direction: row;
gap: 24px;
align-items: flex-start
}

.frnt .phase-icon {
width: 64px;
height: 64px;
flex-shrink: 0;
background: linear-gradient(323deg, #FD68BB 0%, #DFE6E2 100%);
border-radius: 22px;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 4px 25px 0 #fd68bb14;
position: relative
}

.frnt .phase-icon svg {
width: 32px;
height: 32px;
fill: #00304A
}

.frnt .phase-arrow {
position: absolute;
bottom: -24px;
left: 50%;
transform: translateX(-50%);
width: 0;
height: 0;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 12px solid #fd68bb4d;
opacity: .6
}

.frnt .journey-phase:last-child .phase-arrow {
display: none
}

.frnt .phase-content {
flex: 1;
background: #ffffff0d;
border-radius: 14px;
padding: 24px;
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
border: 1px solid #ffffff1a
}

.frnt .phase-h3 {
font-size: 22px;
line-height: 1.2;
color: #fff;
margin: 0 0 8px;
font-weight: 600
}

.frnt .phase-desc {
font-size: 16px;
line-height: 1.8;
color: #DFE6E2;
margin: 0
}

.frnt .floating-icon {
animation: float-motion 3.2s ease-in-out infinite
}

@keyframes float-motion {

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

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

.frnt .icon-delay-1 {
animation-delay: .4s
}

.frnt .icon-delay-2 {
animation-delay: .8s
}

.frnt .icon-delay-3 {
animation-delay: 1.2s
}

@media (max-width: 960px) {
.frnt .tb-wrap {
flex-direction: column;
padding: 32px 16px
}

.frnt .tb-img-strip {
width: 100%;
height: 280px
}

.frnt .tb-h1 {
font-size: 40px
}

.frnt .tb-desc {
font-size: 18px
}

.frnt .instructors-sec {
padding: 32px 16px
}

.frnt .instructors-grid {
grid-template-columns: 1fr
}

.frnt .conditions-sec {
padding: 32px 16px
}

.frnt .conditions-layout {
flex-direction: column
}

.frnt .conditions-img-box {
width: 100%;
transform: translateY(0)
}

.frnt .conditions-img-box img {
height: 320px
}

.frnt .experience-sec {
padding: 32px 16px
}

.frnt .testimonial-wrap {
flex-direction: column;
padding: 24px
}

.frnt .journey-sec {
padding: 32px 16px
}

.frnt .journey-phase {
flex-direction: column;
gap: 16px
}

.frnt .phase-icon {
align-self: center
}
}

@media (max-width: 480px) {
.frnt .tb-h1 {
font-size: 28px
}

.frnt .tb-desc {
font-size: 16px
}

.frnt .instructors-h2,
.frnt .conditions-h2,
.frnt .experience-h2,
.frnt .journey-h2 {
font-size: 28px
}

.frnt .instructor-img {
height: 200px
}

.frnt .testimonial-photo {
width: 120px;
height: 120px
}
}

.contact-reach {
background: #FFF;
max-width: 1024px;
margin: 0 auto
}

.contact-reach .split-title {
display: grid;
grid-template-columns: 1fr 1fr;
min-height: 340px;
position: relative;
overflow: hidden
}

.contact-reach .split-title .left-half {
background: linear-gradient(323deg, #00304A 0%, #004A6E 100%);
display: flex;
flex-direction: column;
justify-content: center;
padding: 64px 64px 64px 32px;
position: relative
}

.contact-reach .split-title .right-half {
background: linear-gradient(323deg, #DFE6E2 0%, #F4F6F5 100%);
display: flex;
flex-direction: column;
justify-content: center;
padding: 64px 32px 64px 64px;
position: relative
}

.contact-reach .split-title .decorative-circle {
position: absolute;
width: 180px;
height: 180px;
border-radius: 50%;
background: #fd68bb14;
top: -60px;
right: -40px;
pointer-events: none
}

.contact-reach .split-title h1 {
font-size: 40px;
line-height: 1.2;
color: #FFF;
margin: 0 0 16px;
letter-spacing: -.02em
}

.contact-reach .split-title .subtitle-text {
font-size: 18px;
line-height: 1.8;
color: #00304A;
margin: 0
}

.contact-reach .primary-form-wrapper {
background: #FFF;
padding: 64px 32px;
position: relative
}

.contact-reach .primary-form-wrapper::before {
content: '';
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
width: 100%;
max-width: 800px;
height: 100%;
background: radial-gradient(ellipse 60% 50% at 50% 50%, #fd68bb0a 0%, transparent 70%);
pointer-events: none;
z-index: 0
}

.contact-reach .form-layout {
display: grid;
grid-template-columns: 2fr 1px 1fr;
gap: 64px;
max-width: 960px;
margin: 0 auto;
position: relative;
z-index: 1
}

.contact-reach .form-column {
display: flex;
flex-direction: column
}

.contact-reach .divider-line {
background: linear-gradient(180deg, transparent 0%, #DFE6E2 20%, #DFE6E2 80%, transparent 100%);
width: 1px
}

.contact-reach .form-column h2 {
font-size: 28px;
line-height: 1.2;
color: #00304A;
margin: 0 0 8px;
letter-spacing: -.01em;
position: relative;
display: inline-block
}

.contact-reach .form-column h2::after {
content: '';
display: inline-block;
width: 6px;
height: 6px;
background: #FD68BB;
border-radius: 50%;
margin: 0 0 8px 8px;
vertical-align: middle
}

.contact-reach .form-column .intro-text {
font-size: 16px;
line-height: 1.8;
color: #00304A;
margin: 0 0 32px;
opacity: .75
}

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

.contact-reach .field-group {
display: flex;
flex-direction: column;
gap: 8px
}

.contact-reach .field-group label {
font-size: 16px;
line-height: 1.2;
color: #00304A;
font-weight: 500
}

.contact-reach .field-group input[type="text"],
.contact-reach .field-group input[type="tel"] {
padding: 16px;
border: 2px solid #DFE6E2;
border-radius: 8px;
font-size: 16px;
line-height: 1.2;
color: #00304A;
background: #FFF;
transition: border-color .12s ease-out, box-shadow .12s ease-out
}

.contact-reach .field-group input[type="text"]:focus,
.contact-reach .field-group input[type="tel"]:focus {
outline: none;
border-color: #FD68BB;
box-shadow: 0 0 0 3px #fd68bb1a
}

.contact-reach .field-group input[type="text"]::placeholder,
.contact-reach .field-group input[type="tel"]::placeholder {
color: #fd68bb4d
}

.contact-reach .options-wrapper {
display: flex;
flex-direction: column;
gap: 8px
}

.contact-reach .options-wrapper label {
font-size: 16px;
line-height: 1.2;
color: #00304A;
font-weight: 500;
margin-bottom: 8px
}

.contact-reach .radio-group {
display: flex;
flex-direction: column;
gap: 12px
}

.contact-reach .radio-option {
display: flex;
align-items: center;
gap: 12px;
cursor: pointer
}

.contact-reach .radio-option input[type="radio"] {
appearance: none;
width: 20px;
height: 20px;
border: 2px solid #DFE6E2;
border-radius: 50%;
position: relative;
cursor: pointer;
transition: border-color .12s ease-out, background-color .12s ease-out
}

.contact-reach .radio-option input[type="radio"]:checked {
border-color: #FD68BB;
background: #FD68BB
}

.contact-reach .radio-option input[type="radio"]:checked::before {
content: '';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 8px;
height: 8px;
background: #FFF;
border-radius: 50%
}

.contact-reach .radio-option span {
font-size: 16px;
line-height: 1.2;
color: #00304A
}

.contact-reach .privacy-consent {
display: flex;
align-items: flex-start;
gap: 12px;
padding: 16px;
background: #dfe6e24d;
border-radius: 8px;
margin-top: 8px
}

.contact-reach .privacy-consent input[type="checkbox"] {
appearance: none;
width: 20px;
height: 20px;
min-width: 20px;
border: 2px solid #DFE6E2;
border-radius: 4px;
position: relative;
cursor: pointer;
margin-top: 2px;
transition: border-color .12s ease-out, background-color .12s ease-out
}

.contact-reach .privacy-consent input[type="checkbox"]:checked {
border-color: #FD68BB;
background: #FD68BB
}

.contact-reach .privacy-consent input[type="checkbox"]:checked::before {
content: '';
position: absolute;
top: 2px;
left: 5px;
width: 5px;
height: 10px;
border: solid #FFF;
border-width: 0 2px 2px 0;
transform: rotate(45deg)
}

.contact-reach .privacy-consent label {
font-size: 16px;
line-height: 1.8;
color: #00304A;
cursor: pointer
}

.contact-reach .privacy-consent a {
color: #FD68BB;
text-decoration: none;
border-bottom: 1px solid #fd68bb4d;
transition: border-bottom-color .1s ease-out
}

.contact-reach .privacy-consent a:hover {
border-bottom-color: #FD68BB
}

.contact-reach .submit-btn {
padding: 16px 32px;
background: #FD68BB;
color: #FFF;
font-size: 18px;
line-height: 1.2;
font-weight: 500;
border: none;
border-radius: 8px;
cursor: pointer;
transition: filter .12s ease-out, transform .1s ease-out;
box-shadow: 0 4px 25px 0 #fd68bb14
}

.contact-reach .submit-btn:hover {
filter: brightness(1.1)
}

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

.contact-reach .details-column {
display: flex;
flex-direction: column;
gap: 32px
}

.contact-reach .detail-block {
display: flex;
flex-direction: column;
gap: 8px;
position: relative;
padding-left: 16px
}

.contact-reach .detail-block::before {
content: '';
position: absolute;
left: 0;
top: 0;
width: 3px;
height: 100%;
background: linear-gradient(180deg, #FD68BB 0%, #DFE6E2 100%);
border-radius: 1px
}

.contact-reach .detail-block h3 {
font-size: 18px;
line-height: 1.2;
color: #00304A;
margin: 0;
font-weight: 600
}

.contact-reach .detail-block p {
font-size: 16px;
line-height: 1.8;
color: #00304A;
margin: 0;
opacity: .85
}

.contact-reach .detail-block a {
font-size: 16px;
line-height: 1.8;
color: #FD68BB;
text-decoration: none;
transition: opacity .1s ease-out
}

.contact-reach .detail-block a:hover {
opacity: .75
}

.contact-reach .metrics-showcase {
background: linear-gradient(323deg, #00304A 0%, #003D5C 100%);
padding: 64px 32px;
position: relative;
overflow: hidden
}

.contact-reach .metrics-showcase::before {
content: '';
position: absolute;
top: -100px;
right: -100px;
width: 300px;
height: 300px;
background: radial-gradient(circle, #fd68bb1f 0%, transparent 70%);
border-radius: 50%;
pointer-events: none
}

.contact-reach .metrics-showcase::after {
content: '';
position: absolute;
bottom: -80px;
left: -80px;
width: 250px;
height: 250px;
background: radial-gradient(circle, #dfe6e20f 0%, transparent 70%);
border-radius: 50%;
pointer-events: none
}

.contact-reach .metrics-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 32px;
max-width: 960px;
margin: 0 auto;
position: relative;
z-index: 1
}

.contact-reach .metric-card {
background: #ffffff0d;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid #ffffff1a;
border-radius: 14px;
padding: 32px 24px;
text-align: center;
transition: transform .15s ease-out, background .15s ease-out;
animation: cascade-scale .6s ease-out backwards
}

.contact-reach .metric-card:nth-child(1) {
animation-delay: .08s
}

.contact-reach .metric-card:nth-child(2) {
animation-delay: .15s
}

.contact-reach .metric-card:nth-child(3) {
animation-delay: .22s
}

@keyframes cascade-scale {
0% {
transform: scale(0.92);
opacity: 0
}

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

.contact-reach .metric-card:hover {
transform: translateY(-4px);
background: #ffffff14
}

.contact-reach .metric-number {
font-size: 72px;
line-height: 1.2;
color: #FD68BB;
margin: 0 0 8px;
font-weight: 700;
letter-spacing: -.03em
}

.contact-reach .metric-label {
font-size: 18px;
line-height: 1.8;
color: #FFF;
margin: 0;
opacity: .9
}

.contact-reach .decorative-divider {
height: 2px;
background: #DFE6E2;
margin: 64px auto;
max-width: 960px;
position: relative;
display: flex;
align-items: center;
justify-content: center
}

.contact-reach .decorative-divider::before {
content: '';
position: absolute;
width: 40px;
height: 40px;
background: #FFF;
border: 2px solid #DFE6E2;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center
}

.contact-reach .decorative-divider::after {
content: '';
position: absolute;
width: 12px;
height: 12px;
background: linear-gradient(135deg, #FD68BB 0%, #DFE6E2 100%);
border-radius: 50%;
z-index: 1
}

.contact-reach .geometric-divider {
height: 8px;
background: repeating-linear-gradient(90deg, #DFE6E2 0px, #DFE6E2 16px, transparent 16px, transparent 24px);
margin: 0;
opacity: .4
}

@media (max-width: 960px) {
.contact-reach .split-title {
grid-template-columns: 1fr;
min-height: auto
}

.contact-reach .split-title .left-half,
.contact-reach .split-title .right-half {
padding: 32px
}

.contact-reach .split-title h1 {
font-size: 28px
}

.contact-reach .form-layout {
grid-template-columns: 1fr;
gap: 32px
}

.contact-reach .divider-line {
display: none
}

.contact-reach .metrics-grid {
grid-template-columns: 1fr;
gap: 24px
}

.contact-reach .primary-form-wrapper {
padding: 32px 24px
}

.contact-reach .details-column {
order: 2
}
}

@media (max-width: 480px) {

.contact-reach .split-title .left-half,
.contact-reach .split-title .right-half {
padding: 24px 16px
}

.contact-reach .split-title h1 {
font-size: 22px
}

.contact-reach .split-title .subtitle-text {
font-size: 16px
}

.contact-reach .primary-form-wrapper {
padding: 24px 16px
}

.contact-reach .form-column h2 {
font-size: 22px
}

.contact-reach .metric-number {
font-size: 40px
}

.contact-reach .metric-label {
font-size: 16px
}

.contact-reach .metrics-showcase {
padding: 32px 16px
}
}

.success-delivery {
background: linear-gradient(323deg, #00304A 0%, #DFE6E2 100%);
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
padding: 64px 16px
}

.success-delivery .confirmation-card {
background: #fff;
max-width: 1024px;
width: 100%;
border-radius: 22px;
padding: 64px 32px;
box-shadow: 0 9px 60px 0 #fd68bb1c;
text-align: center
}

.success-delivery .status-icon {
width: 88px;
height: 88px;
margin: 0 auto 32px;
background: linear-gradient(323deg, #00304A 0%, #DFE6E2 100%);
border-radius: 999px;
display: flex;
align-items: center;
justify-content: center;
position: relative
}

.success-delivery .status-icon::before {
content: '';
width: 36px;
height: 18px;
border-left: 5px solid #fff;
border-bottom: 5px solid #fff;
transform: rotate(-45deg) translateY(-4px)
}

.success-delivery .confirm-title {
font-size: 40px;
line-height: 1.2;
color: #00304A;
margin: 0 0 16px
}

.success-delivery .confirm-message {
font-size: 18px;
line-height: 1.8;
color: #00304A;
margin: 0 0 32px;
max-width: 640px;
margin-left: auto;
margin-right: auto
}

.success-delivery .detail-box {
background: #DFE6E2;
border-radius: 14px;
padding: 24px;
margin: 0 0 32px;
max-width: 640px;
margin-left: auto;
margin-right: auto
}

.success-delivery .detail-row {
display: flex;
justify-content: space-between;
align-items: center;
margin: 0 0 16px
}

.success-delivery .detail-row:last-child {
margin: 0
}

.success-delivery .detail-label {
font-size: 16px;
line-height: 1.8;
color: #00304A;
opacity: .7
}

.success-delivery .detail-value {
font-size: 18px;
line-height: 1.8;
color: #00304A;
font-weight: 600
}

.success-delivery .action-group {
display: flex;
gap: 16px;
justify-content: center;
flex-wrap: wrap
}

.success-delivery .primary-action {
background: #FD68BB;
color: #fff;
border: none;
border-radius: 8px;
padding: 16px 32px;
font-size: 18px;
line-height: 1.2;
cursor: pointer;
transition: filter .12s ease-out;
text-decoration: none;
display: inline-block
}

.success-delivery .primary-action:hover {
filter: brightness(1.15)
}

.success-delivery .secondary-action {
background: #DFE6E2;
color: #00304A;
border: none;
border-radius: 8px;
padding: 16px 32px;
font-size: 18px;
line-height: 1.2;
cursor: pointer;
transition: filter .1s linear;
text-decoration: none;
display: inline-block
}

.success-delivery .secondary-action:hover {
filter: brightness(0.95)
}

.success-delivery .info-notice {
margin: 32px 0 0;
padding: 24px;
background: #fff;
border-radius: 14px;
border: 2px solid #DFE6E2;
max-width: 640px;
margin-left: auto;
margin-right: auto
}

.success-delivery .notice-heading {
font-size: 18px;
line-height: 1.2;
color: #00304A;
margin: 0 0 8px;
font-weight: 600
}

.success-delivery .notice-text {
font-size: 16px;
line-height: 1.8;
color: #00304A;
margin: 0
}

.success-delivery .contact-link {
color: #FD68BB;
text-decoration: none;
transition: opacity .11s ease-out
}

.success-delivery .contact-link:hover {
opacity: .75
}

@media (max-width: 960px) {
.success-delivery .confirmation-card {
padding: 32px 24px
}

.success-delivery .confirm-title {
font-size: 28px
}

.success-delivery .confirm-message {
font-size: 16px
}

.success-delivery .detail-box {
padding: 16px
}

.success-delivery .action-group {
flex-direction: column;
align-items: stretch
}

.success-delivery .primary-action,
.success-delivery .secondary-action {
width: 100%
}
}

@media (max-width: 480px) {
.success-delivery {
padding: 32px 16px
}

.success-delivery .confirmation-card {
padding: 24px 16px
}

.success-delivery .status-icon {
width: 72px;
height: 72px;
margin-bottom: 24px
}

.success-delivery .status-icon::before {
width: 28px;
height: 14px;
border-left: 4px solid #fff;
border-bottom: 4px solid #fff
}

.success-delivery .confirm-title {
font-size: 22px
}

.success-delivery .detail-row {
flex-direction: column;
align-items: flex-start;
gap: 4px
}
}