html {
box-sizing: border-box;
scroll-behavior: smooth
}

body {
margin: 0;
min-height: 100vh;
font-family: 'Noto Serif', serif;
font-size: 18px;
line-height: 1.55;
color: #293117;
background: #fff;
letter-spacing: .01em
}

.topbar {
background: linear-gradient(135deg, #FFF9E6 0%, #fff 100%);
border-bottom: 1px solid #7f09cb1f;
box-shadow: 0 3px 5px 0 #7f09cb0f;
position: relative;
z-index: 100
}

.topbar_inner {
max-width: 1320px;
margin: 0 auto;
padding: 24px 40px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 40px
}

.brand_zone {
display: flex;
align-items: center;
gap: 24px;
flex-shrink: 0
}

.brand_mark {
background: #fff;
border: 2px solid #7f09cb2e;
border-radius: 10px;
box-shadow: 0 3px 5px 0 #2931170f 0 5px 28px 0 #29311717;
padding: 16px;
display: flex;
align-items: center;
justify-content: center;
transition: box-shadow .7s cubic-bezier(0.4, 0, 0.2, 1), border-color .6s ease-in-out
}

.brand_mark:hover {
box-shadow: 0 5px 28px 0 #7f09cb17 0 9px 52px 0 #7f09cb24;
border-color: #7f09cb59
}

.brand_mark img {
width: 78px;
height: 78px;
object-fit: contain;
display: block
}

.trust_badge {
background: linear-gradient(145deg, #7F09CB 0%, #9e3dd6 100%);
border-radius: 6px;
padding: 8px 16px;
color: #fff;
font-size: 15px;
font-weight: 600;
line-height: 1.35;
letter-spacing: .02em;
box-shadow: 0 3px 5px 0 #7f09cb0f;
display: flex;
align-items: center;
gap: 8px;
transition: transform .65s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .7s ease-in-out
}

.trust_badge:hover {
transform: translateY(-2px);
box-shadow: 0 5px 28px 0 #7f09cb17 0 9px 52px 0 #7f09cb24
}

.trust_badge_icon {
width: 20px;
height: 20px;
fill: #FFF9E6
}

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

.nav_link {
font-size: 18px;
font-weight: 500;
line-height: 1.35;
letter-spacing: .015em;
color: #293117;
text-decoration: none;
padding: 16px 24px;
border-radius: 6px;
background: transparent;
border: 2px solid transparent;
transition: background-color .65s ease-in-out, border-color .7s cubic-bezier(0.4, 0, 0.2, 1), color .6s ease-in-out;
position: relative;
overflow: hidden
}

.nav_link::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent 0%, #7f09cb14 50%, transparent 100%);
transition: left .8s cubic-bezier(0.4, 0, 0.2, 1);
z-index: -1
}

.nav_link:hover::before {
left: 100%
}

.nav_link:hover {
background: #fff9e699;
border-color: #7f09cb40;
color: #7F09CB
}

.nav_link:focus {
outline: 3px solid #7F09CB;
outline-offset: 3px;
border-color: #7F09CB
}

.nav_link.active {
background: linear-gradient(135deg, #7f09cb1a 0%, #fff9e680 100%);
border-color: #7f09cb4d;
color: #7F09CB;
font-weight: 600
}

.basefoot {
background: linear-gradient(180deg, #FFF9E6 0%, #fff 100%);
border-top: 2px solid #7f09cb26;
padding: 72px 0 40px;
position: relative
}

.basefoot::before {
content: '';
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
width: 90%;
height: 1px;
background: linear-gradient(90deg, transparent 0%, #7f09cb33 50%, transparent 100%)
}

.basefoot_inner {
max-width: 1320px;
margin: 0 auto;
padding: 0 40px
}

.basefoot_grid {
display: grid;
grid-template-columns: 1.2fr 1fr;
gap: 72px;
margin-bottom: 72px
}

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

.basefoot_brand {
display: flex;
align-items: center;
gap: 24px
}

.basefoot_logo {
background: #fff;
border: 2px solid #7f09cb33;
border-radius: 10px;
box-shadow: 0 3px 5px 0 #2931170f;
padding: 16px;
display: flex;
align-items: center;
justify-content: center
}

.basefoot_logo img {
width: 72px;
height: 72px;
object-fit: contain;
display: block
}

.basefoot_est {
font-size: 15px;
font-weight: 600;
line-height: 1.35;
color: #7F09CB;
letter-spacing: .02em
}

.basefoot_est span {
display: block;
font-size: 22px;
font-weight: 700;
margin-top: 8px
}

.basefoot_about {
font-size: 18px;
line-height: 1.55;
color: #293117;
letter-spacing: .01em;
max-width: 480px
}

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

.contact_item {
display: flex;
align-items: center;
gap: 16px;
font-size: 18px;
line-height: 1.35;
color: #293117;
letter-spacing: .015em
}

.contact_icon {
width: 24px;
height: 24px;
fill: #7F09CB;
flex-shrink: 0
}

.contact_item a {
color: #7F09CB;
text-decoration: none;
border-bottom: 2px solid transparent;
transition: border-color .65s ease-in-out, color .6s cubic-bezier(0.4, 0, 0.2, 1)
}

.contact_item a:hover {
border-bottom-color: #7F09CB;
color: #293117
}

.contact_item a:focus {
outline: 3px solid #7F09CB;
outline-offset: 3px
}

.nav_column {
display: flex;
flex-direction: column;
gap: 40px
}

.nav_group {
display: flex;
flex-direction: column;
gap: 16px
}

.nav_group_title {
font-size: 22px;
font-weight: 700;
line-height: 1.35;
color: #293117;
letter-spacing: .015em;
margin-bottom: 8px
}

.nav_group_desc {
font-size: 15px;
line-height: 1.55;
color: #293117bf;
letter-spacing: .01em;
margin-bottom: 8px
}

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

.basefoot_nav_item a {
font-size: 18px;
font-weight: 500;
line-height: 1.35;
color: #293117;
text-decoration: none;
padding: 8px 0;
display: inline-block;
border-bottom: 2px solid transparent;
transition: border-color .7s cubic-bezier(0.4, 0, 0.2, 1), color .65s ease-in-out, padding-left .6s ease-in-out
}

.basefoot_nav_item a:hover {
border-bottom-color: #7F09CB;
color: #7F09CB;
padding-left: 8px
}

.basefoot_nav_item a:focus {
outline: 3px solid #7F09CB;
outline-offset: 3px
}

.basefoot_bottom {
border-top: 1px solid #7f09cb26;
padding-top: 40px;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 24px
}

.copyright {
font-size: 15px;
line-height: 1.35;
color: #293117b3;
letter-spacing: .01em
}

.legal_nav {
display: flex;
gap: 24px;
flex-wrap: wrap
}

.legal_nav a {
font-size: 15px;
font-weight: 500;
line-height: 1.35;
color: #293117cc;
text-decoration: none;
border-bottom: 2px solid transparent;
transition: border-color .65s ease-in-out, color .7s cubic-bezier(0.4, 0, 0.2, 1);
letter-spacing: .015em
}

.legal_nav a:hover {
border-bottom-color: #7F09CB;
color: #7F09CB
}

.legal_nav a:focus {
outline: 3px solid #7F09CB;
outline-offset: 3px
}

.consent_popup {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) translateX(100vw);
width: 420px;
max-width: calc(100vw - 32px);
background: #fff;
border: 2px solid #7f09cb33;
border-radius: 10px;
box-shadow: 0 9px 52px 0 #29311724 0 5px 28px 0 #7f09cb17;
padding: 40px;
z-index: 8000;
display: none;
animation-delay: 420ms;
transition: transform .42s cubic-bezier(0.4, 0, 0.2, 1)
}

.consent_popup.visible {
transform: translate(-50%, -50%) translateX(0)
}

.consent_headline {
font-size: 22px;
font-weight: 700;
line-height: 1.35;
color: #293117;
letter-spacing: .015em;
margin-bottom: 16px
}

.consent_text {
font-size: 18px;
line-height: 1.55;
color: #293117d9;
letter-spacing: .01em;
margin-bottom: 24px
}

.consent_actions {
display: flex;
gap: 16px;
flex-direction: column
}

.consent_btn {
font-family: 'Noto Serif', serif;
font-size: 18px;
font-weight: 600;
line-height: 1.35;
letter-spacing: .015em;
padding: 16px 24px;
border-radius: 6px;
border: 2px solid transparent;
cursor: pointer;
transition: background .7s ease-in-out, border-color .65s cubic-bezier(0.4, 0, 0.2, 1), transform .6s ease-in-out, box-shadow .7s ease-in-out;
position: relative;
overflow: hidden
}

.consent_btn::before {
content: '';
position: absolute;
inset: 2px;
border-radius: 4px;
border: 2px solid transparent;
opacity: 0;
transition: opacity .65s ease-in-out, border-color .7s cubic-bezier(0.4, 0, 0.2, 1)
}

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

.consent_btn_accept {
background: linear-gradient(135deg, #7F09CB 0%, #9e3dd6 100%);
color: #fff;
box-shadow: 0 3px 5px 0 #7f09cb0f
}

.consent_btn_accept:hover {
background: linear-gradient(135deg, #9e3dd6 0%, #7F09CB 100%);
box-shadow: 0 5px 28px 0 #7f09cb17;
transform: translateY(-2px)
}

.consent_btn_accept::before {
border-color: #fff9e680
}

.consent_btn_accept:focus {
outline: 3px solid #7F09CB;
outline-offset: 3px
}

.consent_btn_decline {
background: linear-gradient(135deg, #FFF9E6 0%, #fff 100%);
color: #293117;
border-color: #7f09cb40
}

.consent_btn_decline:hover {
background: linear-gradient(135deg, #fff 0%, #FFF9E6 100%);
border-color: #7f09cb73;
transform: translateY(-2px);
box-shadow: 0 3px 5px 0 #7f09cb0f
}

.consent_btn_decline::before {
border-color: #7f09cb4d
}

.consent_btn_decline:focus {
outline: 3px solid #293117;
outline-offset: 3px
}

.consent_manager {
position: fixed;
bottom: 24px;
right: 24px;
z-index: 7999;
display: none
}

.consent_manager.show {
display: block
}

.consent_manager_trigger {
background: linear-gradient(135deg, #7F09CB 0%, #9e3dd6 100%);
border: 2px solid #fff9e64d;
border-radius: 6px;
padding: 16px 24px;
color: #fff;
font-family: 'Noto Serif', serif;
font-size: 15px;
font-weight: 600;
line-height: 1.35;
letter-spacing: .02em;
cursor: pointer;
box-shadow: 0 5px 28px 0 #7f09cb17;
transition: background .7s ease-in-out, transform .65s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .7s ease-in-out
}

.consent_manager_trigger:hover {
background: linear-gradient(135deg, #9e3dd6 0%, #7F09CB 100%);
transform: translateY(-3px);
box-shadow: 0 9px 52px 0 #7f09cb24
}

.consent_manager_trigger:focus {
outline: 3px solid #7F09CB;
outline-offset: 3px
}

.consent_preferences {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 520px;
max-width: calc(100vw - 32px);
background: #fff;
border: 2px solid #7f09cb33;
border-radius: 10px;
box-shadow: 0 9px 52px 0 #29311724;
padding: 40px;
z-index: 8001;
display: none
}

.consent_preferences.visible {
display: block
}

.preferences_headline {
font-size: 22px;
font-weight: 700;
line-height: 1.35;
color: #293117;
letter-spacing: .015em;
margin-bottom: 24px
}

.preference_group {
margin-bottom: 24px;
padding-bottom: 24px;
border-bottom: 1px solid #7f09cb26
}

.preference_group:last-of-type {
border-bottom: none;
padding-bottom: 0
}

.preference_label {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
cursor: pointer;
padding: 8px 0
}

.preference_name {
font-size: 18px;
font-weight: 600;
line-height: 1.35;
color: #293117;
letter-spacing: .015em
}

.preference_desc {
font-size: 15px;
line-height: 1.55;
color: #293117bf;
letter-spacing: .01em;
margin-top: 8px
}

.preference_toggle {
position: relative;
width: 56px;
height: 28px;
flex-shrink: 0
}

.preference_toggle input {
opacity: 0;
width: 0;
height: 0;
position: absolute
}

.toggle_slider {
position: absolute;
inset: 0;
background: #29311733;
border-radius: 6px;
transition: background .65s ease-in-out;
cursor: pointer
}

.toggle_slider::before {
content: '';
position: absolute;
width: 20px;
height: 20px;
left: 4px;
top: 4px;
background: #fff;
border-radius: 6px;
box-shadow: 0 3px 5px 0 #2931170f;
transition: transform .65s cubic-bezier(0.4, 0, 0.2, 1), background .6s ease-in-out
}

.preference_toggle input:checked+.toggle_slider {
background: linear-gradient(135deg, #7F09CB 0%, #9e3dd6 100%)
}

.preference_toggle input:checked+.toggle_slider::before {
transform: translateX(28px);
background: #FFF9E6
}

.preference_toggle input:focus+.toggle_slider {
outline: 3px solid #7F09CB;
outline-offset: 3px
}

.preferences_actions {
display: flex;
gap: 16px;
margin-top: 40px
}

.preferences_save {
flex: 1;
font-family: 'Noto Serif', serif;
font-size: 18px;
font-weight: 600;
line-height: 1.35;
letter-spacing: .015em;
padding: 16px 24px;
border-radius: 6px;
border: 2px solid transparent;
background: linear-gradient(135deg, #7F09CB 0%, #9e3dd6 100%);
color: #fff;
cursor: pointer;
box-shadow: 0 3px 5px 0 #7f09cb0f;
transition: background .7s ease-in-out, transform .65s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .7s ease-in-out
}

.preferences_save:hover {
background: linear-gradient(135deg, #9e3dd6 0%, #7F09CB 100%);
transform: translateY(-2px);
box-shadow: 0 5px 28px 0 #7f09cb17
}

.preferences_save:focus {
outline: 3px solid #7F09CB;
outline-offset: 3px
}

.preferences_cancel {
flex: 1;
font-family: 'Noto Serif', serif;
font-size: 18px;
font-weight: 600;
line-height: 1.35;
letter-spacing: .015em;
padding: 16px 24px;
border-radius: 6px;
border: 2px solid #7f09cb40;
background: linear-gradient(135deg, #FFF9E6 0%, #fff 100%);
color: #293117;
cursor: pointer;
transition: background .7s ease-in-out, border-color .65s cubic-bezier(0.4, 0, 0.2, 1), transform .6s ease-in-out
}

.preferences_cancel:hover {
background: linear-gradient(135deg, #fff 0%, #FFF9E6 100%);
border-color: #7f09cb73;
transform: translateY(-2px)
}

.preferences_cancel:focus {
outline: 3px solid #293117;
outline-offset: 3px
}

@media (max-width: 968px) {
.topbar_inner {
flex-direction: column;
align-items: flex-start;
gap: 24px;
padding: 24px
}

.brand_zone {
width: 100%;
justify-content: space-between
}

.primary_nav {
width: 100%;
flex-direction: column;
gap: 8px
}

.nav_link {
width: 100%;
text-align: left
}

.basefoot_grid {
grid-template-columns: 1fr;
gap: 40px
}

.basefoot_inner {
padding: 0 24px
}

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

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

@media (max-width: 640px) {
.brand_zone {
flex-direction: column;
align-items: flex-start
}

.trust_badge {
align-self: flex-start
}

.consent_popup {
width: calc(100vw - 32px);
padding: 24px
}

.consent_preferences {
width: calc(100vw - 32px);
padding: 24px
}

.preferences_actions {
flex-direction: column
}

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

.k-legal-section {
max-width: 1320px;
margin: 0 auto;
padding: 72px 24px;
background: #fff
}

.k-legal-section h1 {
font-size: 72px;
line-height: 1.1;
letter-spacing: .01em;
color: #293117;
margin-bottom: 40px
}

.k-legal-section h2 {
font-size: 42px;
line-height: 1.1;
letter-spacing: .01em;
color: #293117;
margin-top: 72px;
margin-bottom: 24px
}

.k-legal-section h3 {
font-size: 22px;
line-height: 1.35;
letter-spacing: .015em;
color: #293117;
margin-top: 40px;
margin-bottom: 16px
}

.k-legal-section h4 {
font-size: 18px;
line-height: 1.35;
letter-spacing: .015em;
color: #293117;
margin-top: 24px;
margin-bottom: 16px
}

.k-legal-section p {
font-size: 18px;
line-height: 1.55;
letter-spacing: .015em;
color: #293117;
margin-bottom: 24px
}

.k-legal-section ul {
font-size: 18px;
line-height: 1.55;
letter-spacing: .015em;
color: #293117;
margin-bottom: 24px;
padding-left: 40px;
list-style-type: disc
}

.k-legal-section ol {
font-size: 18px;
line-height: 1.55;
letter-spacing: .015em;
color: #293117;
margin-bottom: 24px;
padding-left: 40px;
list-style-type: decimal
}

.k-legal-section li {
margin-bottom: 8px
}

.k-legal-section ul ul,
.k-legal-section ol ul,
.k-legal-section ul ol,
.k-legal-section ol ol {
margin-top: 8px;
margin-bottom: 8px
}

.k-legal-section strong,
.k-legal-section b {
font-weight: 600;
color: #293117
}

.k-legal-section em,
.k-legal-section i {
font-style: italic
}

.k-legal-section a {
color: #7F09CB;
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 2px;
transition: color .35s cubic-bezier(0.4, 0, 0.2, 1)
}

.k-legal-section a:hover {
color: #293117
}

.k-legal-section a:focus {
outline: 2px solid #7F09CB;
outline-offset: 2px;
border-radius: 6px
}

.k-legal-section table {
width: 100%;
font-size: 18px;
line-height: 1.55;
letter-spacing: .015em;
border-collapse: collapse;
margin-bottom: 40px;
background: #fff;
box-shadow: 0 3px 5px 0 #7f09cb0f;
border-radius: 10px;
overflow: hidden
}

.k-legal-section thead {
background: #FFF9E6
}

.k-legal-section th {
padding: 16px 24px;
text-align: left;
font-weight: 600;
color: #293117;
border-bottom: 2px solid #7F09CB
}

.k-legal-section td {
padding: 16px 24px;
color: #293117;
border-bottom: 1px solid #7f09cb1a
}

.k-legal-section tr:last-child td {
border-bottom: none
}

.k-legal-section tbody tr {
transition: background-color .3s cubic-bezier(0.4, 0, 0.2, 1)
}

.k-legal-section tbody tr:hover {
background-color: #fff9e64d
}

.k-legal-section div {
margin-bottom: 24px
}

@media (max-width: 768px) {
.k-legal-section {
padding: 40px 16px
}

.k-legal-section h1 {
font-size: 42px;
margin-bottom: 24px
}

.k-legal-section h2 {
font-size: 22px;
margin-top: 40px;
margin-bottom: 16px
}

.k-legal-section h3 {
font-size: 18px;
margin-top: 24px
}

.k-legal-section h4 {
font-size: 18px
}

.k-legal-section p,
.k-legal-section ul,
.k-legal-section ol {
font-size: 15px
}

.k-legal-section ul,
.k-legal-section ol {
padding-left: 24px
}

.k-legal-section table {
font-size: 15px;
display: block;
overflow-x: auto
}

.k-legal-section th,
.k-legal-section td {
padding: 8px 16px
}
}

.casestudydtl {
background: #fff;
color: #293117;
overflow-x: clip
}

.casestudydtl .ttlblock {
position: relative;
padding: 72px 24px;
background: #293117;
overflow: visible;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 480px
}

.casestudydtl .ttlblock::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: radial-gradient(circle, #7f09cb0a 1px, transparent 1px), radial-gradient(circle, #7f09cb0a 1px, transparent 1px);
background-size: 48px 48px, 64px 64px;
background-position: 0 0, 32px 32px;
pointer-events: none;
z-index: 1
}

.casestudydtl .ttlblock::after {
content: '';
position: absolute;
bottom: -120px;
right: 8%;
width: 240px;
height: 240px;
background: radial-gradient(ellipse at center, #7f09cb1f, #29311714);
border-radius: 50%;
animation: rotateshape 28s linear infinite;
pointer-events: none;
z-index: 2;
transform-origin: center center
}

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

to {
transform: rotate(360deg)
}
}

.casestudydtl .ttlwrap {
position: relative;
z-index: 3;
max-width: 1320px;
width: 100%;
text-align: center
}

.casestudydtl .eyebrow {
font-size: 15px;
line-height: 1.35;
letter-spacing: .02em;
color: #fff9e6bf;
margin: 0 0 16px;
text-transform: uppercase
}

.casestudydtl .maintitle {
font-size: 72px;
line-height: 1.1;
letter-spacing: .01em;
color: #FFF9E6;
margin: 0
}

.casestudydtl .subtitle {
font-size: 22px;
line-height: 1.35;
letter-spacing: .015em;
color: #fff9e6d9;
margin: 24px 0 0;
max-width: 880px;
margin-left: auto;
margin-right: auto
}

.casestudydtl .metabar {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 40px;
margin: 40px 0 0;
flex-wrap: wrap
}

.casestudydtl .metaitem {
display: flex;
flex-direction: row;
align-items: center;
gap: 8px;
font-size: 15px;
line-height: 1.35;
letter-spacing: .015em;
color: #fff9e6b3
}

.casestudydtl .metaicon {
width: 18px;
height: 18px;
fill: none;
stroke: #7f09cbe6;
stroke-width: 2;
stroke-linecap: round;
stroke-linejoin: round
}

.casestudydtl .articlecontent {
max-width: 1320px;
margin: 0 auto;
padding: 72px 24px;
display: grid;
grid-template-columns: 1fr;
gap: 72px
}

.casestudydtl .imgblock {
width: 100%;
max-width: 100%;
overflow: hidden;
border-radius: 10px;
box-shadow: 0 9px 52px 0 #7f09cb24
}

.casestudydtl .mainimg {
width: 100%;
height: auto;
display: block;
object-fit: cover;
transition: transform .75s cubic-bezier(0.4, 0, 0.2, 1)
}

.casestudydtl .imgblock:hover .mainimg {
transform: scale(1.04)
}

.casestudydtl .txtcontent {
max-width: 880px;
margin: 0 auto
}

.casestudydtl .txtcontent p {
font-size: 18px;
line-height: 1.55;
letter-spacing: .015em;
color: #293117;
margin: 0 0 24px
}

.casestudydtl .txtcontent p:last-child {
margin-bottom: 0
}

.casestudydtl .txtcontent h2 {
font-size: 42px;
line-height: 1.1;
letter-spacing: .01em;
color: #293117;
margin: 72px 0 24px;
position: relative;
display: inline-block;
background: linear-gradient(90deg, #7f09cb14, #fff9e680);
padding: 8px 24px;
border-radius: 6px
}

.casestudydtl .txtcontent h2:first-child {
margin-top: 0
}

.casestudydtl .txtcontent h4 {
font-size: 22px;
line-height: 1.35;
letter-spacing: .015em;
color: #293117;
margin: 40px 0 16px;
background: #7f09cb0f;
padding: 8px 16px;
border-radius: 6px;
display: inline-block
}

.casestudydtl .txtcontent del {
text-decoration: line-through;
color: #29311780
}

.casestudydtl .txtcontent abbr {
text-decoration: none;
border-bottom: 1px dotted #7F09CB;
cursor: help
}

.casestudydtl .txtcontent ul {
list-style: none;
padding: 0;
margin: 24px 0
}

.casestudydtl .txtcontent li {
font-size: 18px;
line-height: 1.55;
letter-spacing: .015em;
color: #293117;
padding: 16px 0;
border-bottom: 1px solid #7f09cb1f;
position: relative;
padding-left: 32px
}

.casestudydtl .txtcontent li:last-child {
border-bottom: none
}

.casestudydtl .txtcontent li::before {
content: '';
position: absolute;
left: 0;
top: 24px;
width: 6px;
height: 6px;
background: #7F09CB;
border-radius: 50%
}

.casestudydtl .txtcontent blockquote {
margin: 40px 0;
padding: 24px 40px;
background: #FFF9E6;
border-radius: 10px;
position: relative;
font-size: 22px;
line-height: 1.35;
letter-spacing: .015em;
color: #293117;
font-style: italic
}

.casestudydtl .txtcontent cite {
display: block;
margin-top: 16px;
font-size: 15px;
line-height: 1.35;
letter-spacing: .02em;
color: #293117b3;
font-style: normal
}

.casestudydtl .insightgrid {
background: #FFF9E6;
padding: 72px 24px;
position: relative
}

.casestudydtl .insightgrid::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 4px;
background: linear-gradient(90deg, #7F09CB 0%, #7f09cb4d 100%)
}

.casestudydtl .insightinner {
max-width: 1320px;
margin: 0 auto;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 40px
}

.casestudydtl .insightcard {
background: #fff;
padding: 40px 24px;
border-radius: 10px;
box-shadow: 0 3px 5px 0 #7f09cb0f;
transition: box-shadow .65s cubic-bezier(0.4, 0, 0.2, 1), transform .65s cubic-bezier(0.4, 0, 0.2, 1);
position: relative;
overflow: hidden;
display: flex;
flex-direction: column;
align-items: flex-start
}

.casestudydtl .insightcard::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: radial-gradient(ellipse at center, #7f09cb08, transparent);
opacity: 0;
transition: opacity .65s cubic-bezier(0.4, 0, 0.2, 1);
pointer-events: none
}

.casestudydtl .insightcard:hover {
box-shadow: 0 9px 52px 0 #7f09cb24;
transform: translateY(-8px)
}

.casestudydtl .insightcard:hover::before {
opacity: 1
}

.casestudydtl .insightnum {
font-size: 72px;
line-height: 1.1;
letter-spacing: .01em;
color: #7F09CB;
margin: 0 0 8px;
position: relative
}

.casestudydtl .insightbar {
width: 100%;
height: 3px;
background: #7f09cb1a;
border-radius: 6px;
margin: 0 0 24px;
position: relative;
overflow: hidden
}

.casestudydtl .insightfill {
position: absolute;
top: 0;
left: 0;
height: 100%;
background: linear-gradient(90deg, #7F09CB, #293117);
border-radius: 6px;
transition: width .85s cubic-bezier(0.4, 0, 0.2, 1)
}

.casestudydtl .insightcard:hover .insightfill {
width: 100%
}

.casestudydtl .insightlabel {
font-size: 18px;
line-height: 1.35;
letter-spacing: .015em;
color: #293117;
margin: 0
}

.casestudydtl .chartsection {
padding: 72px 24px;
background: #fff;
position: relative
}

.casestudydtl .chartinner {
max-width: 1320px;
margin: 0 auto;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 72px;
align-items: center
}

.casestudydtl .chartheading {
font-size: 42px;
line-height: 1.1;
letter-spacing: .01em;
color: #293117;
margin: 0 0 24px
}

.casestudydtl .chartdesc {
font-size: 18px;
line-height: 1.55;
letter-spacing: .015em;
color: #293117d9;
margin: 0
}

.casestudydtl .chartwrap {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
gap: 40px
}

.casestudydtl .donut {
position: relative;
width: 280px;
height: 280px
}

.casestudydtl .donutsvg {
width: 100%;
height: 100%;
transform: rotate(-90deg)
}

.casestudydtl .donutbg {
fill: none;
stroke: #7f09cb14;
stroke-width: 32
}

.casestudydtl .donutprogress {
fill: none;
stroke: url(#donutgrad);
stroke-width: 32;
stroke-linecap: round;
transition: stroke-dashoffset .85s cubic-bezier(0.4, 0, 0.2, 1)
}

.casestudydtl .donutcenter {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center
}

.casestudydtl .donutvalue {
font-size: 42px;
line-height: 1.1;
letter-spacing: .01em;
color: #7F09CB;
margin: 0
}

.casestudydtl .donutsubtxt {
font-size: 15px;
line-height: 1.35;
letter-spacing: .015em;
color: #293117b3;
margin: 8px 0 0
}

.casestudydtl .legend {
display: flex;
flex-direction: column;
gap: 16px;
width: 100%
}

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

.casestudydtl .legendcolor {
width: 24px;
height: 24px;
border-radius: 6px;
flex-shrink: 0
}

.casestudydtl .legendtxt {
font-size: 18px;
line-height: 1.35;
letter-spacing: .015em;
color: #293117;
margin: 0;
flex-grow: 1
}

.casestudydtl .legendpct {
font-size: 18px;
line-height: 1.35;
letter-spacing: .015em;
color: #7F09CB;
margin: 0;
font-weight: 600
}

.casestudydtl .actionblock {
background: radial-gradient(ellipse at center, #7F09CB, #293117);
padding: 72px 24px;
position: relative;
overflow: hidden
}

.casestudydtl .actionblock::before {
content: '';
position: absolute;
top: -50%;
left: -10%;
width: 120%;
height: 200%;
background: radial-gradient(ellipse at center, #fff9e614, transparent 60%);
pointer-events: none;
animation: rotateshape 32s linear infinite reverse
}

.casestudydtl .actioninner {
max-width: 1320px;
margin: 0 auto;
text-align: center;
position: relative;
z-index: 2
}

.casestudydtl .actionheading {
font-size: 42px;
line-height: 1.1;
letter-spacing: .01em;
color: #FFF9E6;
margin: 0 0 24px
}

.casestudydtl .actiontxt {
font-size: 18px;
line-height: 1.55;
letter-spacing: .015em;
color: #fff9e6d9;
margin: 0 0 40px;
max-width: 720px;
margin-left: auto;
margin-right: auto
}

.casestudydtl .btnrow {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 24px;
flex-wrap: wrap
}

.casestudydtl .btnprimary {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 16px 40px;
font-size: 18px;
line-height: 1.35;
letter-spacing: .015em;
color: #293117;
background: linear-gradient(135deg, #FFF9E6, #fff9e6d9);
border: 2px solid transparent;
border-radius: 10px;
text-decoration: none;
transition: transform .65s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .65s cubic-bezier(0.4, 0, 0.2, 1), border-color .65s cubic-bezier(0.4, 0, 0.2, 1);
box-shadow: 0 5px 28px 0 #fff9e617;
cursor: pointer;
position: relative
}

.casestudydtl .btnprimary::before {
content: '';
position: absolute;
top: 4px;
left: 4px;
right: 4px;
bottom: 4px;
border: 1px solid #7f09cb00;
border-radius: 8px;
transition: border-color .65s cubic-bezier(0.4, 0, 0.2, 1);
pointer-events: none
}

.casestudydtl .btnprimary:hover {
transform: translateY(-4px);
box-shadow: 0 9px 52px 0 #fff9e624;
border-color: #7f09cb4d
}

.casestudydtl .btnprimary:hover::before {
border-color: #7f09cb80
}

.casestudydtl .btnsecondary {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 16px 40px;
font-size: 18px;
line-height: 1.35;
letter-spacing: .015em;
color: #FFF9E6;
background: transparent;
border: 2px solid #fff9e666;
border-radius: 10px;
text-decoration: none;
transition: background .65s cubic-bezier(0.4, 0, 0.2, 1), border-color .65s cubic-bezier(0.4, 0, 0.2, 1), transform .65s cubic-bezier(0.4, 0, 0.2, 1);
cursor: pointer;
position: relative
}

.casestudydtl .btnsecondary::before {
content: '';
position: absolute;
top: 4px;
left: 4px;
right: 4px;
bottom: 4px;
border: 1px solid #fff9e600;
border-radius: 8px;
transition: border-color .65s cubic-bezier(0.4, 0, 0.2, 1);
pointer-events: none
}

.casestudydtl .btnsecondary:hover {
background: #fff9e614;
border-color: #fff9e6b3;
transform: translateY(-4px)
}

.casestudydtl .btnsecondary:hover::before {
border-color: #fff9e64d
}

.casestudydtl .divider {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 16px;
padding: 40px 24px;
background: #fff
}

.casestudydtl .arrow {
width: 0;
height: 0;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 12px solid #7f09cb4d
}

.casestudydtl .floaticon {
width: 48px;
height: 48px;
fill: none;
stroke: #7F09CB;
stroke-width: 2;
stroke-linecap: round;
stroke-linejoin: round;
animation: iconswayloop 4.5s ease-in-out infinite
}

@keyframes iconswayloop {

0%,
100% {
transform: translateY(0px) rotate(0deg)
}

25% {
transform: translateY(-8px) rotate(-3deg)
}

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

75% {
transform: translateY(-12px) rotate(3deg)
}
}

.casestudydtl .insightcard:nth-child(1) .insightfill {
width: 78%
}

.casestudydtl .insightcard:nth-child(2) .insightfill {
width: 62%
}

.casestudydtl .insightcard:nth-child(3) .insightfill {
width: 85%
}

@media (max-width: 1024px) {
.casestudydtl .maintitle {
font-size: 42px
}

.casestudydtl .subtitle {
font-size: 18px
}

.casestudydtl .chartinner {
grid-template-columns: 1fr;
gap: 40px
}

.casestudydtl .insightinner {
grid-template-columns: 1fr
}
}

@media (max-width: 768px) {
.casestudydtl .ttlblock {
padding: 40px 24px;
min-height: 360px
}

.casestudydtl .maintitle {
font-size: 32px
}

.casestudydtl .subtitle {
font-size: 16px
}

.casestudydtl .metabar {
gap: 24px
}

.casestudydtl .articlecontent {
padding: 40px 24px;
gap: 40px
}

.casestudydtl .txtcontent h2 {
font-size: 28px;
padding: 6px 16px
}

.casestudydtl .txtcontent h4 {
font-size: 18px
}

.casestudydtl .txtcontent blockquote {
font-size: 18px;
padding: 16px 24px
}

.casestudydtl .insightgrid {
padding: 40px 24px
}

.casestudydtl .insightnum {
font-size: 42px
}

.casestudydtl .chartsection {
padding: 40px 24px
}

.casestudydtl .chartheading {
font-size: 28px
}

.casestudydtl .donut {
width: 220px;
height: 220px
}

.casestudydtl .donutvalue {
font-size: 32px
}

.casestudydtl .actionblock {
padding: 40px 24px
}

.casestudydtl .actionheading {
font-size: 28px
}

.casestudydtl .btnrow {
flex-direction: column;
gap: 16px
}

.casestudydtl .btnprimary,
.casestudydtl .btnsecondary {
width: 100%
}
}

.casestdies {
margin: 0;
padding: 0;
background: #fff;
color: #293117;
overflow-x: clip
}

.casestdies .tpblock {
position: relative;
display: flex;
align-items: flex-start;
max-width: 1320px;
margin: 0 auto;
padding: 72px 40px 40px;
min-height: 520px;
overflow: hidden
}

.casestdies .tpblock::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 24px;
background: repeating-linear-gradient(90deg, #7F09CB 0px, #7F09CB 16px, transparent 16px, transparent 32px);
clip-path: polygon(0 0, 8px 100%, 16px 0, 24px 100%, 32px 0, 40px 100%, 48px 0, 56px 100%, 64px 0, 72px 100%, 80px 0, 88px 100%, 96px 0, 104px 100%, 112px 0, 120px 100%, 128px 0, 136px 100%, 144px 0, 152px 100%, 160px 0, 168px 100%, 176px 0, 184px 100%, 192px 0, 200px 100%, 208px 0, 216px 100%, 224px 0, 232px 100%, 240px 0, 248px 100%, 256px 0, 264px 100%, 272px 0, 280px 100%, 288px 0, 296px 100%, 304px 0, 312px 100%, 320px 0, 328px 100%, 336px 0, 344px 100%, 352px 0, 360px 100%, 368px 0, 376px 100%, 384px 0, 392px 100%, 400px 0, 408px 100%, 416px 0, 424px 100%, 432px 0, 440px 100%, 448px 0, 456px 100%, 464px 0, 472px 100%, 480px 0, 488px 100%, 496px 0, 504px 100%, 512px 0, 520px 100%, 528px 0, 536px 100%, 544px 0, 552px 100%, 560px 0, 568px 100%, 576px 0, 584px 100%, 592px 0, 600px 100%, 608px 0, 616px 100%, 624px 0, 632px 100%, 640px 0, 648px 100%, 656px 0, 664px 100%, 672px 0, 680px 100%, 688px 0, 696px 100%, 704px 0, 712px 100%, 720px 0, 728px 100%, 736px 0, 744px 100%, 752px 0, 760px 100%, 768px 0, 776px 100%, 784px 0, 792px 100%, 800px 0, 808px 100%, 816px 0, 824px 100%, 832px 0, 840px 100%, 848px 0, 856px 100%, 864px 0, 872px 100%, 880px 0, 888px 100%, 896px 0, 904px 100%, 912px 0, 920px 100%, 928px 0, 936px 100%, 944px 0, 952px 100%, 960px 0, 968px 100%, 976px 0, 984px 100%, 992px 0, 1000px 100%, 1008px 0, 1016px 100%, 1024px 0, 1032px 100%, 1040px 0, 1048px 100%, 1056px 0, 1064px 100%, 1072px 0, 1080px 100%, 1088px 0, 1096px 100%, 1104px 0, 1112px 100%, 1120px 0, 1128px 100%, 1136px 0, 1144px 100%, 1152px 0, 1160px 100%, 1168px 0, 1176px 100%, 1184px 0, 1192px 100%, 1200px 0, 1208px 100%, 1216px 0, 1224px 100%, 1232px 0, 1240px 100%, 1248px 0, 1256px 100%, 1264px 0, 1272px 100%, 1280px 0, 1288px 100%, 1296px 0, 1304px 100%, 1312px 0, 1320px 100%, 100% 100%, 100% 0)
}

.casestdies .tpblock::after {
content: '';
position: absolute;
top: 40px;
left: 24px;
width: 48px;
height: 48px;
background: #7f09cb24;
border-radius: 50%;
z-index: 1
}

.casestdies .tpleft {
flex: 0 0 50%;
padding: 72px 40px 40px 0;
z-index: 2
}

.casestdies .tpleft h1 {
font-size: 72px;
line-height: 1.1;
letter-spacing: .01em;
margin: 0;
color: #293117
}

.casestdies .tpleft h1::first-letter {
color: #7F09CB;
font-size: 92px
}

.casestdies .tpright {
flex: 0 0 50%;
position: relative;
display: flex;
align-items: flex-start;
justify-content: flex-end;
padding: 24px 0
}

.casestdies .tpright img {
width: 100%;
max-width: 580px;
height: auto;
object-fit: cover;
border-radius: 10px;
filter: grayscale(100%);
box-shadow: 0 9px 52px 0 #7f09cb24
}

.casestdies .tpshape {
position: absolute;
bottom: 72px;
right: 120px;
width: 72px;
height: 72px;
background: #fff9e63d;
clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
z-index: 1
}

.casestdies .postslst {
max-width: 1320px;
margin: 0 auto;
padding: 72px 40px;
position: relative
}

.casestdies .postslst::before {
content: '';
position: absolute;
top: -40px;
left: 0;
right: 0;
height: 80px;
background: linear-gradient(180deg, #7f09cb08 0%, #fff0 100%);
filter: blur(24px);
pointer-events: none
}

.casestdies .lsthdr {
margin: 0 0 40px
}

.casestdies .lsthdr h2 {
font-size: 42px;
line-height: 1.35;
letter-spacing: .015em;
margin: 0;
padding: 8px 16px;
background: linear-gradient(90deg, #FFF9E6 0%, #fff9e600 100%);
display: inline-block;
border-radius: 6px
}

.casestdies .postgrd {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 40px
}

.casestdies .pstcrd {
background: #fff;
border-radius: 10px;
overflow: hidden;
box-shadow: 0 3px 5px 0 #7f09cb0f;
transition: box-shadow .7s cubic-bezier(0.4, 0, 0.2, 1), transform .65s cubic-bezier(0.4, 0, 0.2, 1);
opacity: 0;
animation: pstappear .8s cubic-bezier(0.4, 0, 0.2, 1) forwards
}

.casestdies .pstcrd:nth-child(1) {
animation-delay: .1s
}

.casestdies .pstcrd:nth-child(2) {
animation-delay: .25s
}

.casestdies .pstcrd:nth-child(3) {
animation-delay: .4s
}

.casestdies .pstcrd:nth-child(4) {
animation-delay: .55s
}

.casestdies .pstcrd:nth-child(5) {
animation-delay: .7s
}

@keyframes pstappear {
from {
opacity: 0;
transform: translateY(24px)
}

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

.casestdies .pstcrd:hover {
box-shadow: 0 9px 52px 0 #7f09cb24;
transform: translateY(-8px)
}

.casestdies .pstimgwrap {
position: relative;
width: 100%;
height: 240px;
overflow: hidden;
background: #FFF9E6
}

.casestdies .pstimgwrap img {
width: 100%;
height: 100%;
object-fit: cover;
transition: filter .75s cubic-bezier(0.4, 0, 0.2, 1)
}

.casestdies .pstcrd:hover .pstimgwrap img {
filter: sepia(0.4) hue-rotate(240deg) saturate(1.8)
}

.casestdies .psttag {
position: absolute;
top: 16px;
left: 16px;
background: #7f09cbeb;
color: #fff;
padding: 8px 16px;
border-radius: 6px;
font-size: 15px;
line-height: 1.35;
letter-spacing: .02em;
z-index: 2
}

.casestdies .pstcnt {
padding: 24px
}

.casestdies .pstcnt h3 {
font-size: 22px;
line-height: 1.35;
letter-spacing: .015em;
margin: 0 0 8px;
color: #293117
}

.casestdies .pstcnt h3 a {
color: inherit;
text-decoration: none;
transition: color .35s ease-in-out
}

.casestdies .pstcnt h3 a:hover {
color: #7F09CB
}

.casestdies .pstsub {
font-size: 15px;
line-height: 1.55;
letter-spacing: .015em;
margin: 0 0 16px;
color: #293117b8
}

.casestdies .pstdsc {
font-size: 15px;
line-height: 1.55;
letter-spacing: .015em;
margin: 0 0 16px;
color: #293117
}

.casestdies .pstmeta {
display: flex;
align-items: center;
justify-content: space-between;
padding: 16px 0 0;
border-top: 1px solid #7f09cb1f
}

.casestdies .pstdate {
font-size: 15px;
line-height: 1.35;
letter-spacing: .015em;
color: #293117a3
}

.casestdies .pststats {
display: flex;
align-items: center;
gap: 16px
}

.casestdies .pstviews,
.casestdies .pstlikes {
display: flex;
align-items: center;
gap: 8px;
font-size: 15px;
line-height: 1.35;
letter-spacing: .015em;
color: #293117a3
}

.casestdies .pstviews svg,
.casestdies .pstlikes svg {
width: 18px;
height: 18px;
fill: #7f09cba3
}

.casestdies .insightsec {
background: radial-gradient(ellipse at 50% 50%, #7f09cb0f, #2931170f);
padding: 72px 40px;
position: relative
}

.casestdies .insightsec::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 24px;
background: repeating-linear-gradient(90deg, #293117 0px, #293117 16px, transparent 16px, transparent 32px);
clip-path: polygon(0 100%, 8px 0, 16px 100%, 24px 0, 32px 100%, 40px 0, 48px 100%, 56px 0, 64px 100%, 72px 0, 80px 100%, 88px 0, 96px 100%, 104px 0, 112px 100%, 120px 0, 128px 100%, 136px 0, 144px 100%, 152px 0, 160px 100%, 168px 0, 176px 100%, 184px 0, 192px 100%, 200px 0, 208px 100%, 216px 0, 224px 100%, 232px 0, 240px 100%, 248px 0, 256px 100%, 264px 0, 272px 100%, 280px 0, 288px 100%, 296px 0, 304px 100%, 312px 0, 320px 100%, 328px 0, 336px 100%, 344px 0, 352px 100%, 360px 0, 368px 100%, 376px 0, 384px 100%, 392px 0, 400px 100%, 408px 0, 416px 100%, 424px 0, 432px 100%, 440px 0, 448px 100%, 456px 0, 464px 100%, 472px 0, 480px 100%, 488px 0, 496px 100%, 504px 0, 512px 100%, 520px 0, 528px 100%, 536px 0, 544px 100%, 552px 0, 560px 100%, 568px 0, 576px 100%, 584px 0, 592px 100%, 600px 0, 608px 100%, 616px 0, 624px 100%, 632px 0, 640px 100%, 648px 0, 656px 100%, 664px 0, 672px 100%, 680px 0, 688px 100%, 696px 0, 704px 100%, 712px 0, 720px 100%, 728px 0, 736px 100%, 744px 0, 752px 100%, 760px 0, 768px 100%, 776px 0, 784px 100%, 792px 0, 800px 100%, 808px 0, 816px 100%, 824px 0, 832px 100%, 840px 0, 848px 100%, 856px 0, 864px 100%, 872px 0, 880px 100%, 888px 0, 896px 100%, 904px 0, 912px 100%, 920px 0, 928px 100%, 936px 0, 944px 100%, 952px 0, 960px 100%, 968px 0, 976px 100%, 984px 0, 992px 100%, 1000px 0, 1008px 100%, 1016px 0, 1024px 100%, 1032px 0, 1040px 100%, 1048px 0, 1056px 100%, 1064px 0, 1072px 100%, 1080px 0, 1088px 100%, 1096px 0, 1104px 100%, 1112px 0, 1120px 100%, 1128px 0, 1136px 100%, 1144px 0, 1152px 100%, 1160px 0, 1168px 100%, 1176px 0, 1184px 100%, 1192px 0, 1200px 100%, 1208px 0, 1216px 100%, 1224px 0, 1232px 100%, 1240px 0, 1248px 100%, 1256px 0, 1264px 100%, 1272px 0, 1280px 100%, 1288px 0, 1296px 100%, 1304px 0, 1312px 100%, 1320px 0, 100% 0, 100% 100%)
}

.casestdies .insightcntr {
max-width: 1320px;
margin: 0 auto;
display: flex;
align-items: center;
gap: 72px
}

.casestdies .insightlft {
flex: 1 1 60%
}

.casestdies .insightlft h2 {
font-size: 42px;
line-height: 1.35;
letter-spacing: .015em;
margin: 0 0 24px;
position: relative;
padding: 0 0 0 24px
}

.casestdies .insightlft h2::before {
content: '';
position: absolute;
left: 0;
top: 8px;
width: 12px;
height: 12px;
background: #7F09CB;
border-radius: 50%
}

.casestdies .insightlft h3 {
font-size: 22px;
line-height: 1.35;
letter-spacing: .015em;
margin: 0 0 16px;
color: #7F09CB
}

.casestdies .insightlft h4 {
font-size: 18px;
line-height: 1.35;
letter-spacing: .015em;
margin: 24px 0 8px;
color: #293117
}

.casestdies .insightlft h5 {
font-size: 15px;
line-height: 1.35;
letter-spacing: .015em;
margin: 16px 0 8px;
color: #293117d6;
text-transform: uppercase
}

.casestdies .insightlft p {
font-size: 15px;
line-height: 1.55;
letter-spacing: .015em;
margin: 0 0 16px;
color: #293117
}

.casestdies .insightrgt {
flex: 0 0 35%;
display: flex;
align-items: center;
justify-content: center
}

.casestdies .funnelchart {
width: 100%;
max-width: 320px;
display: flex;
flex-direction: column;
gap: 16px
}

.casestdies .funnelstage {
position: relative;
display: flex;
align-items: center;
justify-content: center;
padding: 16px 24px;
background: #fff;
border-radius: 6px;
box-shadow: 0 3px 5px 0 #7f09cb0f;
transition: transform .45s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .5s cubic-bezier(0.4, 0, 0.2, 1)
}

.casestdies .funnelstage:hover {
transform: translateX(8px);
box-shadow: 0 5px 28px 0 #7f09cb17
}

.casestdies .funnelstage:nth-child(1) {
width: 100%;
background: linear-gradient(90deg, #7F09CB, #7f09cbb8);
color: #fff
}

.casestdies .funnelstage:nth-child(2) {
width: 85%;
margin-left: auto;
background: linear-gradient(90deg, #7f09cbb8, #7f09cb85);
color: #fff
}

.casestdies .funnelstage:nth-child(3) {
width: 68%;
margin-left: auto;
background: linear-gradient(90deg, #7f09cb85, #7f09cb52);
color: #293117
}

.casestdies .funnelstage:nth-child(4) {
width: 48%;
margin-left: auto;
background: linear-gradient(90deg, #7f09cb52, #7f09cb29);
color: #293117
}

.casestdies .funnelstage span {
font-size: 15px;
line-height: 1.35;
letter-spacing: .015em;
font-weight: 600
}

.casestdies .methodsec {
background: #fff;
padding: 72px 40px;
position: relative
}

.casestdies .methodcntr {
max-width: 1320px;
margin: 0 auto;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 40px
}

.casestdies .methodcol {
display: flex;
flex-direction: column;
gap: 24px
}

.casestdies .methodcol.center {
padding: 40px 0
}

.casestdies .methodhdr {
margin: 0 0 24px;
grid-column: 1 / -1
}

.casestdies .methodhdr h2 {
font-size: 42px;
line-height: 1.35;
letter-spacing: .015em;
margin: 0;
color: #293117
}

.casestdies .methodcard {
background: #FFF9E6;
padding: 24px;
border-radius: 10px;
box-shadow: 0 3px 5px 0 #2931170f;
transition: background .55s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .6s cubic-bezier(0.4, 0, 0.2, 1);
position: relative
}

.casestdies .methodcard:hover {
background: #fff;
box-shadow: 0 5px 28px 0 #29311717
}

.casestdies .methodcard h3 {
font-size: 22px;
line-height: 1.35;
letter-spacing: .015em;
margin: 0 0 16px;
color: #293117
}

.casestdies .methodcard p {
font-size: 15px;
line-height: 1.55;
letter-spacing: .015em;
margin: 0;
color: #293117
}

.casestdies .methodcard.large {
padding: 40px;
background: linear-gradient(135deg, #7f09cb14, #fff9e6eb)
}

.casestdies .methodcard.large h3 {
font-size: 28px
}

@media (max-width: 1024px) {
.casestdies .tpblock {
flex-direction: column;
padding: 40px 24px
}

.casestdies .tpleft,
.casestdies .tpright {
flex: 1 1 100%;
padding: 0
}

.casestdies .tpleft {
margin-bottom: 40px
}

.casestdies .tpleft h1 {
font-size: 42px
}

.casestdies .tpleft h1::first-letter {
font-size: 56px
}

.casestdies .tpright img {
max-width: 100%
}

.casestdies .postgrd {
grid-template-columns: repeat(2, 1fr);
gap: 24px
}

.casestdies .insightcntr {
flex-direction: column;
gap: 40px
}

.casestdies .insightlft,
.casestdies .insightrgt {
flex: 1 1 100%
}

.casestdies .methodcntr {
grid-template-columns: 1fr;
gap: 24px
}

.casestdies .methodcol.center {
padding: 0
}
}

@media (max-width: 768px) {
.casestdies .tpblock {
padding: 24px 16px;
min-height: auto
}

.casestdies .tpleft h1 {
font-size: 32px
}

.casestdies .tpleft h1::first-letter {
font-size: 42px
}

.casestdies .postslst {
padding: 40px 16px
}

.casestdies .postgrd {
grid-template-columns: 1fr;
gap: 24px
}

.casestdies .lsthdr h2 {
font-size: 32px
}

.casestdies .insightsec {
padding: 40px 16px
}

.casestdies .insightlft h2 {
font-size: 32px
}

.casestdies .methodsec {
padding: 40px 16px
}

.casestdies .methodhdr h2 {
font-size: 32px
}

.casestdies .funnelchart {
max-width: 100%
}
}

.abtUs {
background: #FFF;
color: #293117;
line-height: 1.55;
font-size: 18px;
letter-spacing: .015em
}

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

.abtUs .maxWdth {
max-width: 1320px;
margin-left: auto;
margin-right: auto;
padding-left: 24px;
padding-right: 24px
}

.abtUs .bnrIntro {
background: #FFF9E6;
padding-top: 72px;
padding-bottom: 72px;
position: relative;
overflow: hidden
}

.abtUs .bnrIntro::before {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 400px;
height: 400px;
background: radial-gradient(ellipse at center, #7f09cb14, #2931170a);
transform: translate(-50%, -50%);
animation: pulseExpand 8000ms ease-in-out infinite;
pointer-events: none
}

@keyframes pulseExpand {

0%,
100% {
transform: translate(-50%, -50%) scale(1);
opacity: 1
}

50% {
transform: translate(-50%, -50%) scale(1.3);
opacity: .6
}
}

.abtUs .bnrIntro::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
background: linear-gradient(90deg, #7F09CB 0%, #293117 100%)
}

.abtUs .bnrGrid {
display: grid;
grid-template-columns: 320px 1fr;
gap: 40px;
align-items: center;
position: relative;
z-index: 1
}

.abtUs .bnrImgCard {
background: #FFF;
padding: 16px;
border-radius: 10px;
box-shadow: 0 5px 28px 0 #7f09cb17;
overflow: hidden
}

.abtUs .bnrImgCard img {
width: 100%;
height: 280px;
object-fit: cover;
display: block;
border-radius: 6px;
filter: grayscale(100%)
}

.abtUs .bnrTxtZone h1 {
font-size: 42px;
line-height: 1.1;
letter-spacing: .01em;
margin: 0 0 24px;
color: #293117
}

.abtUs .bnrTxtZone h1 .numAccent {
color: #7F09CB;
font-size: 72px;
line-height: 1;
display: inline-block;
margin-right: 8px
}

.abtUs .bnrTxtZone p {
margin: 0;
color: #293117
}

.abtUs .stryOrigin {
padding-top: 72px;
padding-bottom: 72px;
background: #FFF
}

.abtUs .stryOrigin .maxWdth {
display: flex;
flex-direction: column;
gap: 40px
}

.abtUs .stryOrigin .hdngWrap {
background: #7F09CB;
display: inline-block;
padding: 8px 24px;
border-radius: 6px;
margin-bottom: 16px
}

.abtUs .stryOrigin h2 {
font-size: 42px;
line-height: 1.1;
letter-spacing: .01em;
margin: 0;
color: #FFF
}

.abtUs .stryOrigin .introPara {
font-size: 22px;
line-height: 1.35;
letter-spacing: .015em;
padding-bottom: 24px;
margin-bottom: 24px;
border-bottom: 1px solid #7f09cb26;
color: #293117
}

.abtUs .stryOrigin .introPara::first-letter {
font-size: 72px;
line-height: 1;
color: #7F09CB;
float: left;
margin-right: 8px;
margin-top: 8px
}

.abtUs .stryOrigin p {
margin: 0 0 16px;
color: #293117
}

.abtUs .stryOrigin p:last-child {
margin-bottom: 0
}

.abtUs .valuesGrid {
padding-top: 72px;
padding-bottom: 72px;
background: #7F09CB;
position: relative;
overflow: hidden
}

.abtUs .valuesGrid::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: linear-gradient(30deg, #fff9e608 12%, transparent 12.5%, transparent 87%, #fff9e608 87.5%, #fff9e608), linear-gradient(150deg, #fff9e608 12%, transparent 12.5%, transparent 87%, #fff9e608 87.5%, #fff9e608), linear-gradient(30deg, #fff9e608 12%, transparent 12.5%, transparent 87%, #fff9e608 87.5%, #fff9e608), linear-gradient(150deg, #fff9e608 12%, transparent 12.5%, transparent 87%, #fff9e608 87.5%, #fff9e608), linear-gradient(60deg, #fff9e60d 25%, transparent 25.5%, transparent 75%, #fff9e60d 75%, #fff9e60d), linear-gradient(60deg, #fff9e60d 25%, transparent 25.5%, transparent 75%, #fff9e60d 75%, #fff9e60d);
background-size: 80px 140px;
background-position: 0 0, 0 0, 40px 70px, 40px 70px, 0 0, 40px 70px;
pointer-events: none
}

.abtUs .valuesGrid h2 {
font-size: 42px;
line-height: 1.1;
letter-spacing: .01em;
margin: 0 0 40px;
color: #FFF9E6;
position: relative
}

.abtUs .valuesGrid .gridCont {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
position: relative
}

.abtUs .valCard {
background: #fff9e61f;
padding: 24px;
border-radius: 10px;
transition: transform 700ms cubic-bezier(0.4, 0, 0.2, 1), box-shadow 700ms cubic-bezier(0.4, 0, 0.2, 1);
position: relative;
overflow: hidden
}

.abtUs .valCard::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 3px;
background: linear-gradient(90deg, #FFF9E6 0%, #293117 100%);
transform: scaleX(0);
transform-origin: left;
transition: transform 800ms cubic-bezier(0.4, 0, 0.2, 1)
}

.abtUs .valCard:hover {
transform: translateY(-8px);
box-shadow: 0 9px 52px 0 #29311724
}

.abtUs .valCard:hover::before {
transform: scaleX(1)
}

.abtUs .valCard h3 {
font-size: 22px;
line-height: 1.35;
letter-spacing: .015em;
margin: 0 0 16px;
color: #FFF9E6
}

.abtUs .valCard p {
margin: 0;
color: #FFF9E6;
font-size: 15px;
line-height: 1.55
}

.abtUs .teamShowcase {
padding-top: 72px;
padding-bottom: 72px;
background: #FFF
}

.abtUs .teamShowcase h2 {
font-size: 42px;
line-height: 1.1;
letter-spacing: .01em;
margin: 0 0 40px;
color: #293117
}

.abtUs .teamShowcase .teamLayout {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 40px
}

.abtUs .tmMember {
display: flex;
flex-direction: column;
gap: 24px
}

.abtUs .tmMember .imgWrap {
position: relative;
overflow: hidden;
border-radius: 10px;
box-shadow: 0 5px 28px 0 #7f09cb17
}

.abtUs .tmMember .imgWrap img {
width: 100%;
height: 380px;
object-fit: cover;
display: block;
filter: saturate(0.7) brightness(1.05) contrast(1.1);
transition: transform 750ms cubic-bezier(0.4, 0, 0.2, 1), filter 750ms cubic-bezier(0.4, 0, 0.2, 1)
}

.abtUs .tmMember:hover .imgWrap img {
transform: scale(1.08);
filter: saturate(1) brightness(1) contrast(1)
}

.abtUs .tmMember h3 {
font-size: 22px;
line-height: 1.35;
letter-spacing: .015em;
margin: 0 0 8px;
color: #293117
}

.abtUs .tmMember .role {
font-size: 15px;
line-height: 1.55;
letter-spacing: .015em;
color: #7F09CB;
margin: 0 0 16px
}

.abtUs .tmMember p {
margin: 0;
color: #293117;
font-size: 15px;
line-height: 1.55
}

.abtUs .metricsDisplay {
padding-top: 72px;
padding-bottom: 72px;
background: #FFF9E6;
position: relative
}

.abtUs .metricsDisplay::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 1px;
background: linear-gradient(90deg, #293117 0%, #7F09CB 100%)
}

.abtUs .metricsDisplay h2 {
font-size: 42px;
line-height: 1.1;
letter-spacing: .01em;
margin: 0 0 40px;
color: #293117
}

.abtUs .metricsDisplay .metricsFlex {
display: flex;
flex-direction: row;
gap: 24px;
justify-content: space-between
}

.abtUs .metricBox {
flex: 1;
background: #FFF;
padding: 40px 24px;
border-radius: 10px;
text-align: center;
box-shadow: 0 3px 5px 0 #7f09cb0f;
position: relative;
overflow: hidden;
transition: transform 650ms cubic-bezier(0.4, 0, 0.2, 1), box-shadow 650ms cubic-bezier(0.4, 0, 0.2, 1)
}

.abtUs .metricBox::before {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 4px;
background: radial-gradient(ellipse at center, #7F09CB, #293117);
transform: scaleX(0);
transform-origin: center;
transition: transform 850ms cubic-bezier(0.4, 0, 0.2, 1)
}

.abtUs .metricBox:hover {
transform: translateY(-6px);
box-shadow: 0 9px 52px 0 #7f09cb24
}

.abtUs .metricBox:hover::before {
transform: scaleX(1)
}

.abtUs .metricBox .bigNum {
font-size: 72px;
line-height: 1;
letter-spacing: .01em;
color: #7F09CB;
margin: 0 0 8px;
display: block
}

.abtUs .metricBox .bigNum sup {
font-size: 42px;
color: #293117;
margin-left: 4px
}

.abtUs .metricBox .metricLabel {
font-size: 18px;
line-height: 1.35;
letter-spacing: .015em;
color: #293117;
margin: 0
}

.abtUs .metricBox .metricDesc {
font-size: 15px;
line-height: 1.55;
letter-spacing: .015em;
color: #293117;
margin: 8px 0 0;
opacity: .8
}

.abtUs .dashedConnector {
position: relative;
padding-top: 16px
}

.abtUs .dashedConnector::before {
content: '';
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
width: 2px;
height: 16px;
background-image: linear-gradient(to bottom, #7F09CB 50%, transparent 50%);
background-size: 2px 8px;
background-repeat: repeat-y
}

@media (max-width: 1024px) {
.abtUs .bnrGrid {
grid-template-columns: 1fr;
gap: 24px
}

.abtUs .bnrImgCard {
max-width: 400px;
margin: 0 auto
}

.abtUs .valuesGrid .gridCont {
grid-template-columns: 1fr
}

.abtUs .teamShowcase .teamLayout {
grid-template-columns: 1fr;
gap: 40px
}

.abtUs .metricsDisplay .metricsFlex {
flex-direction: column
}
}

@media (max-width: 768px) {
.abtUs .bnrIntro {
padding-top: 40px;
padding-bottom: 40px
}

.abtUs .bnrTxtZone h1 {
font-size: 32px
}

.abtUs .bnrTxtZone h1 .numAccent {
font-size: 52px
}

.abtUs .stryOrigin {
padding-top: 40px;
padding-bottom: 40px
}

.abtUs .stryOrigin h2 {
font-size: 32px
}

.abtUs .stryOrigin .introPara {
font-size: 18px
}

.abtUs .valuesGrid {
padding-top: 40px;
padding-bottom: 40px
}

.abtUs .valuesGrid h2 {
font-size: 32px;
margin-bottom: 24px
}

.abtUs .teamShowcase {
padding-top: 40px;
padding-bottom: 40px
}

.abtUs .teamShowcase h2 {
font-size: 32px;
margin-bottom: 24px
}

.abtUs .metricsDisplay {
padding-top: 40px;
padding-bottom: 40px
}

.abtUs .metricsDisplay h2 {
font-size: 32px;
margin-bottom: 24px
}

.abtUs .metricBox .bigNum {
font-size: 52px
}

.abtUs .metricBox .bigNum sup {
font-size: 32px
}
}

.dbt {
background: #FFF;
color: #293117;
overflow-x: clip
}

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

.dbt .dbtTitleBlock {
display: flex;
flex-direction: row;
align-items: stretch;
max-width: 1320px;
margin: 0 auto 72px;
padding: 0;
position: relative;
min-height: 480px
}

.dbt .dbtTitleImgWrap {
flex: 1 1 50%;
position: relative;
overflow: hidden;
border-radius: 10px;
box-shadow: 0 5px 28px 0 #7f09cb17
}

.dbt .dbtTitleImgWrap::after {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 60%;
background: linear-gradient(to bottom, #29311780, transparent);
pointer-events: none
}

.dbt .dbtTitleImg {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition: transform .7s cubic-bezier(0.4, 0, 0.2, 1)
}

.dbt .dbtTitleImgWrap:hover .dbtTitleImg {
transform: scale(1.05)
}

.dbt .dbtTitleTxt {
flex: 1 1 50%;
display: flex;
flex-direction: column;
justify-content: center;
padding: 72px;
position: relative
}

.dbt .dbtTitleTxt::before {
content: '';
position: absolute;
top: 24px;
right: 24px;
width: 180px;
height: 180px;
border: 3px solid #7f09cb1f;
border-radius: 50%;
pointer-events: none
}

.dbt .dbtTitleH {
font-size: 72px;
line-height: 1.1;
letter-spacing: .01em;
margin: 0 0 24px;
color: #293117
}

.dbt .dbtTitleSub {
font-size: 22px;
line-height: 1.55;
letter-spacing: .015em;
margin: 0 0 40px;
color: #293117;
opacity: .85
}

.dbt .dbtTitleLink {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 16px 40px;
background: linear-gradient(135deg, #7F09CB 0%, #293117 100%);
color: #FFF;
text-decoration: none;
border-radius: 6px;
font-size: 18px;
letter-spacing: .015em;
transition: box-shadow .65s cubic-bezier(0.4, 0, 0.2, 1), transform .65s cubic-bezier(0.4, 0, 0.2, 1);
align-self: flex-start;
position: relative;
overflow: hidden;
box-shadow: 0 3px 5px 0 #7f09cb0f
}

.dbt .dbtTitleLink::before {
content: '';
position: absolute;
inset: 3px;
border: 2px solid #fff0;
border-radius: 4px;
transition: border-color .65s cubic-bezier(0.4, 0, 0.2, 1);
pointer-events: none
}

.dbt .dbtTitleLink:hover {
box-shadow: 0 9px 52px 0 #7f09cb24;
transform: translateY(-2px)
}

.dbt .dbtTitleLink:hover::before {
border-color: #fff6
}

.dbt .dbtOfferSec {
max-width: 1320px;
margin: 0 auto 72px;
padding: 72px 40px;
position: relative;
background: radial-gradient(ellipse at center, #fff9e666 0%, #fff0 70%)
}

.dbt .dbtOfferSec::before {
content: '∑';
position: absolute;
top: -40px;
right: 80px;
font-size: 320px;
line-height: 1;
color: #7f09cb0a;
font-weight: 300;
pointer-events: none;
z-index: 0
}

.dbt .dbtOfferInner {
position: relative;
z-index: 1
}

.dbt .dbtOfferH {
font-size: 42px;
line-height: 1.35;
letter-spacing: .01em;
margin: 0 0 16px;
text-align: center;
color: #293117
}

.dbt .dbtOfferIntro {
font-size: 18px;
line-height: 1.55;
letter-spacing: .015em;
text-align: center;
margin: 0 auto 72px;
max-width: 720px;
color: #293117;
opacity: .9
}

.dbt .dbtOfferGrid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 40px
}

.dbt .dbtOfferCard {
background: #FFF;
border-radius: 10px;
padding: 40px;
box-shadow: 0 3px 5px 0 #7f09cb0f;
transition: box-shadow .75s cubic-bezier(0.4, 0, 0.2, 1), transform .75s cubic-bezier(0.4, 0, 0.2, 1);
position: relative;
overflow: hidden;
opacity: 0;
animation: dbtSlideInStagger .8s cubic-bezier(0.4, 0, 0.2, 1) forwards
}

.dbt .dbtOfferCard:nth-child(1) {
animation-delay: .1s
}

.dbt .dbtOfferCard:nth-child(2) {
animation-delay: .3s
}

.dbt .dbtOfferCard:nth-child(3) {
animation-delay: .5s
}

@keyframes dbtSlideInStagger {
from {
opacity: 0;
transform: translateY(40px)
}

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

.dbt .dbtOfferCard::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 6px;
height: 100%;
background: linear-gradient(to bottom, #7F09CB, #293117);
transform: scaleY(0);
transform-origin: top;
transition: transform .65s cubic-bezier(0.4, 0, 0.2, 1)
}

.dbt .dbtOfferCard:hover {
box-shadow: 0 9px 52px 0 #7f09cb24;
transform: translateY(-4px)
}

.dbt .dbtOfferCard:hover::before {
transform: scaleY(1)
}

.dbt .dbtOfferCardH {
font-size: 22px;
line-height: 1.35;
letter-spacing: .015em;
margin: 0 0 16px;
color: #293117
}

.dbt .dbtOfferCardH::first-letter {
color: #7F09CB;
font-size: 1.4em
}

.dbt .dbtOfferCardTxt {
font-size: 15px;
line-height: 1.55;
letter-spacing: .015em;
margin: 0;
color: #293117;
opacity: .85
}

.dbt .dbtSupportSec {
max-width: 1320px;
margin: 0 auto 72px;
padding: 0 40px;
display: flex;
flex-direction: row;
gap: 72px;
align-items: center
}

.dbt .dbtSupportContent {
flex: 1 1 55%
}

.dbt .dbtSupportH {
font-size: 42px;
line-height: 1.35;
letter-spacing: .01em;
margin: 0 0 24px;
color: #293117;
position: relative;
display: inline-block
}

.dbt .dbtSupportH::after {
content: '';
position: absolute;
bottom: -8px;
left: 0;
width: 60%;
height: 3px;
background: linear-gradient(to right, #7F09CB, transparent)
}

.dbt .dbtSupportList {
list-style: none;
margin: 0;
padding: 0
}

.dbt .dbtSupportItem {
padding: 24px 0;
border-bottom: 1px solid #7f09cb1a;
transition: padding-left .35s cubic-bezier(0.4, 0, 0.2, 1)
}

.dbt .dbtSupportItem:hover {
padding-left: 16px
}

.dbt .dbtSupportItemH {
font-size: 18px;
line-height: 1.35;
letter-spacing: .015em;
margin: 0 0 8px;
color: #293117
}

.dbt .dbtSupportItemTxt {
font-size: 15px;
line-height: 1.55;
letter-spacing: .015em;
margin: 0;
color: #293117;
opacity: .8
}

.dbt .dbtSupportVisual {
flex: 1 1 45%;
position: relative
}

.dbt .dbtSupportImg {
width: 100%;
height: auto;
border-radius: 10px;
box-shadow: 0 5px 28px 0 #7f09cb17;
transition: box-shadow .8s cubic-bezier(0.4, 0, 0.2, 1), transform .8s cubic-bezier(0.4, 0, 0.2, 1);
display: block
}

.dbt .dbtSupportImg:hover {
box-shadow: 0 9px 52px 0 #7f09cb24;
transform: scale(1.02)
}

.dbt .dbtDivider {
max-width: 1320px;
margin: 0 auto 72px;
padding: 0 40px;
display: flex;
align-items: center;
justify-content: center
}

.dbt .dbtDividerLine {
height: 1px;
background: #7f09cb26;
flex: 1
}

.dbt .dbtDividerShape {
width: 16px;
height: 16px;
background: #7F09CB;
transform: rotate(45deg);
margin: 0 24px
}

.dbt .dbtInvestSec {
max-width: 1320px;
margin: 0 auto 72px;
padding: 72px 40px;
background: radial-gradient(ellipse at center, #fff9e699 0%, #fffffff2 100%);
border-radius: 10px;
position: relative;
overflow: hidden
}

.dbt .dbtInvestBg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 0
}

.dbt .dbtInvestBgZone1 {
position: absolute;
top: -20%;
right: -10%;
width: 50%;
height: 80%;
background: radial-gradient(ellipse at center, #7f09cb14, transparent);
animation: dbtAurora1 18s ease-in-out infinite alternate
}

.dbt .dbtInvestBgZone2 {
position: absolute;
bottom: -20%;
left: -10%;
width: 50%;
height: 80%;
background: radial-gradient(ellipse at center, #2931170f, transparent);
animation: dbtAurora2 22s ease-in-out infinite alternate
}

@keyframes dbtAurora1 {
0% {
transform: translate(0, 0) scale(1);
opacity: 1
}

50% {
transform: translate(-8%, 5%) scale(1.15);
opacity: .7
}

100% {
transform: translate(5%, -8%) scale(1.05);
opacity: .9
}
}

@keyframes dbtAurora2 {
0% {
transform: translate(0, 0) scale(1);
opacity: 1
}

50% {
transform: translate(8%, -5%) scale(1.1);
opacity: .8
}

100% {
transform: translate(-5%, 8%) scale(1.2);
opacity: .6
}
}

.dbt .dbtInvestInner {
position: relative;
z-index: 1;
display: flex;
flex-direction: row;
gap: 72px;
align-items: flex-start
}

.dbt .dbtInvestLeft {
flex: 1 1 60%
}

.dbt .dbtInvestH {
font-size: 42px;
line-height: 1.35;
letter-spacing: .01em;
margin: 0 0 40px;
color: #293117
}

.dbt .dbtInvestBlock {
margin-bottom: 40px
}

.dbt .dbtInvestBlockH {
font-size: 18px;
line-height: 1.35;
letter-spacing: .015em;
margin: 0 0 8px;
padding: 8px 16px;
background: #7f09cb1a;
display: inline-block;
border-radius: 6px;
color: #293117
}

.dbt .dbtInvestBlockTxt {
font-size: 15px;
line-height: 1.55;
letter-spacing: .015em;
margin: 16px 0 0;
color: #293117;
opacity: .85
}

.dbt .dbtInvestRight {
flex: 1 1 40%;
display: flex;
align-items: center;
justify-content: center
}

.dbt .dbtDonut {
position: relative;
width: 280px;
height: 280px
}

.dbt .dbtDonutSvg {
width: 100%;
height: 100%;
transform: rotate(-90deg)
}

.dbt .dbtDonutBg {
fill: none;
stroke: #7f09cb1a;
stroke-width: 40
}

.dbt .dbtDonutArc1 {
fill: none;
stroke: #7F09CB;
stroke-width: 40;
stroke-dasharray: 251.2 628;
stroke-linecap: round;
transition: stroke-dasharray .9s cubic-bezier(0.4, 0, 0.2, 1)
}

.dbt .dbtDonutArc2 {
fill: none;
stroke: #293117;
stroke-width: 40;
stroke-dasharray: 188.4 628;
stroke-dashoffset: -251.2;
stroke-linecap: round;
transition: stroke-dasharray .9s cubic-bezier(0.4, 0, 0.2, 1)
}

.dbt .dbtDonutCenter {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center
}

.dbt .dbtDonutNum {
font-size: 42px;
line-height: 1.1;
letter-spacing: .01em;
color: #293117;
display: block;
margin: 0
}

.dbt .dbtDonutLabel {
font-size: 15px;
line-height: 1.35;
letter-spacing: .015em;
color: #293117;
opacity: .7;
display: block;
margin: 8px 0 0
}

.dbt .dbtDonutLegend {
margin-top: 24px;
display: flex;
flex-direction: column;
gap: 16px
}

.dbt .dbtDonutLegendItem {
display: flex;
align-items: center;
gap: 16px
}

.dbt .dbtDonutLegendDot {
width: 16px;
height: 16px;
border-radius: 50%;
flex-shrink: 0
}

.dbt .dbtDonutLegendDot.primary {
background: #7F09CB
}

.dbt .dbtDonutLegendDot.secondary {
background: #293117
}

.dbt .dbtDonutLegendTxt {
font-size: 15px;
line-height: 1.35;
letter-spacing: .015em;
color: #293117;
opacity: .85
}

.dbt .dbtApproachSec {
max-width: 1320px;
margin: 0 auto 72px;
padding: 0 40px
}

.dbt .dbtApproachH {
font-size: 42px;
line-height: 1.35;
letter-spacing: .01em;
margin: 0 0 72px;
text-align: center;
color: #293117
}

.dbt .dbtApproachGrid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 40px
}

.dbt .dbtApproachCard {
display: flex;
flex-direction: row;
gap: 24px;
padding: 40px;
background: #FFF;
border-radius: 10px;
box-shadow: 0 3px 5px 0 #7f09cb0f;
transition: box-shadow .7s cubic-bezier(0.4, 0, 0.2, 1);
position: relative
}

.dbt .dbtApproachCard::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 8px;
height: 100%;
background: #7F09CB;
border-radius: 10px 0 0 10px;
opacity: 0;
transition: opacity .6s cubic-bezier(0.4, 0, 0.2, 1)
}

.dbt .dbtApproachCard:hover {
box-shadow: 0 9px 52px 0 #7f09cb24
}

.dbt .dbtApproachCard:hover::before {
opacity: 1
}

.dbt .dbtApproachIcon {
flex-shrink: 0;
width: 72px;
height: 72px;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(135deg, #7f09cb1a, #2931171a);
border-radius: 6px;
transition: transform .6s cubic-bezier(0.4, 0, 0.2, 1)
}

.dbt .dbtApproachCard:hover .dbtApproachIcon {
transform: rotate(5deg) scale(1.08)
}

.dbt .dbtApproachIconSvg {
width: 40px;
height: 40px;
stroke: #7F09CB;
fill: none;
stroke-width: 2;
stroke-linecap: round;
stroke-linejoin: round
}

.dbt .dbtApproachCardContent {
flex: 1
}

.dbt .dbtApproachCardH {
font-size: 18px;
line-height: 1.35;
letter-spacing: .015em;
margin: 0 0 8px;
color: #293117
}

.dbt .dbtApproachCardTxt {
font-size: 15px;
line-height: 1.55;
letter-spacing: .015em;
margin: 0;
color: #293117;
opacity: .85
}

.dbt .dbtApproachFeatured {
margin-top: 40px;
padding: 40px;
background: #FFF;
border-radius: 10px;
box-shadow: 0 5px 28px 0 #7f09cb17;
display: flex;
flex-direction: row;
gap: 40px;
align-items: center
}

.dbt .dbtApproachFeaturedImg {
flex: 1 1 45%;
border-radius: 6px;
overflow: hidden;
box-shadow: 0 3px 5px 0 #7f09cb0f
}

.dbt .dbtApproachFeaturedImgEl {
width: 100%;
height: auto;
display: block;
transition: transform .85s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .85s cubic-bezier(0.4, 0, 0.2, 1)
}

.dbt .dbtApproachFeaturedImg:hover .dbtApproachFeaturedImgEl {
transform: scale(1.05)
}

.dbt .dbtApproachFeaturedContent {
flex: 1 1 55%
}

.dbt .dbtApproachFeaturedH {
font-size: 22px;
line-height: 1.35;
letter-spacing: .015em;
margin: 0 0 16px;
color: #293117
}

.dbt .dbtApproachFeaturedTxt {
font-size: 15px;
line-height: 1.55;
letter-spacing: .015em;
margin: 0;
color: #293117;
opacity: .85
}

@media (max-width: 1024px) {
.dbt .dbtTitleBlock {
flex-direction: column;
min-height: auto
}

.dbt .dbtTitleImgWrap {
height: 400px
}

.dbt .dbtTitleTxt {
padding: 40px
}

.dbt .dbtTitleH {
font-size: 42px
}

.dbt .dbtOfferGrid {
grid-template-columns: 1fr;
gap: 24px
}

.dbt .dbtSupportSec {
flex-direction: column;
gap: 40px
}

.dbt .dbtInvestInner {
flex-direction: column;
gap: 40px
}

.dbt .dbtApproachGrid {
grid-template-columns: 1fr
}

.dbt .dbtApproachFeatured {
flex-direction: column
}
}

@media (max-width: 768px) {
.dbt .dbtTitleTxt {
padding: 24px
}

.dbt .dbtTitleH {
font-size: 42px
}

.dbt .dbtTitleSub {
font-size: 18px
}

.dbt .dbtOfferSec {
padding: 40px 24px
}

.dbt .dbtOfferH {
font-size: 42px
}

.dbt .dbtOfferCard {
padding: 24px
}

.dbt .dbtSupportSec {
padding: 0 24px
}

.dbt .dbtSupportH {
font-size: 42px
}

.dbt .dbtInvestSec {
padding: 40px 24px
}

.dbt .dbtInvestH {
font-size: 42px
}

.dbt .dbtApproachSec {
padding: 0 24px
}

.dbt .dbtApproachH {
font-size: 42px
}

.dbt .dbtApproachCard {
flex-direction: column;
padding: 24px
}

.dbt .dbtApproachFeatured {
padding: 24px
}

.dbt .dbtDonut {
width: 240px;
height: 240px
}

.dbt .dbtDonutNum {
font-size: 42px
}
}

.cntctus {
background: #FFF;
color: #293117;
max-width: 1320px;
margin: 0 auto;
padding: 0
}

.cntctus .initzone {
position: relative;
display: flex;
flex-direction: row;
align-items: center;
gap: 72px;
padding: 72px 24px;
background: linear-gradient(135deg, #FFF9E6 0%, #FFF 100%);
overflow: hidden
}

.cntctus .initzone::before {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 8px;
background: linear-gradient(180deg, #7F09CB 0%, #293117 100%)
}

.cntctus .imgcard {
flex-shrink: 0;
width: 380px;
height: 420px;
border-radius: 10px;
background: radial-gradient(ellipse at 50% 50%, #7f09cb1f, #29311714);
box-shadow: 0 5px 28px 0 #7f09cb17;
position: relative;
opacity: .75;
transition: opacity .75s cubic-bezier(0.4, 0, 0.2, 1)
}

.cntctus .initzone:hover .imgcard {
opacity: .9
}

.cntctus .imgcard::after {
content: '';
position: absolute;
top: 40px;
right: -30px;
width: 120px;
height: 120px;
border-radius: 50%;
background: radial-gradient(ellipse at 50% 50%, #7f09cb26, transparent);
pointer-events: none
}

.cntctus .imgcard::before {
content: '';
position: absolute;
bottom: 60px;
left: -40px;
width: 160px;
height: 160px;
border-radius: 6px;
background: radial-gradient(ellipse at 50% 50%, #29311714, transparent);
transform: rotate(25deg);
pointer-events: none
}

.cntctus .txtdom {
flex: 1;
padding: 40px 40px 40px 24px
}

.cntctus .numaccent {
font-size: 72px;
line-height: 1.1;
letter-spacing: .01em;
color: #7F09CB;
font-weight: 700;
margin: 0 0 16px;
animation: cntctusScaleIn .85s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
transform-origin: left center
}

@keyframes cntctusScaleIn {
0% {
opacity: 0;
transform: scale(0.8)
}

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

.cntctus .maintxt {
font-size: 42px;
line-height: 1.35;
letter-spacing: .015em;
color: #293117;
margin: 0 0 24px;
font-weight: 600
}

.cntctus .explan {
font-size: 18px;
line-height: 1.55;
letter-spacing: .02em;
color: #293117;
margin: 0;
opacity: .85
}

.cntctus .formsec {
position: relative;
padding: 72px 24px;
background: #FFF;
border-top: 1px solid transparent;
background-image: linear-gradient(90deg, transparent 0%, #7f09cb40 50%, transparent 100%);
background-size: 100% 1px;
background-repeat: no-repeat;
background-position: top center
}

.cntctus .formsec::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: radial-gradient(circle, #7f09cb08 1px, transparent 1px);
background-size: 24px 24px;
pointer-events: none;
animation: cntctusPatternShift 45s linear infinite
}

@keyframes cntctusPatternShift {
0% {
background-position: 0 0
}

100% {
background-position: 24px 24px
}
}

.cntctus .formwrap {
max-width: 780px;
margin: 0 auto;
position: relative;
z-index: 1
}

.cntctus .formhd {
font-size: 42px;
line-height: 1.35;
letter-spacing: .015em;
color: #FFF;
background: linear-gradient(110deg, #7F09CB 0%, #293117 100%);
padding: 16px 24px;
border-radius: 6px;
margin: 0 0 40px;
display: inline-block;
box-shadow: 0 5px 28px 0 #7f09cb17
}

.cntctus .formintro {
font-size: 18px;
line-height: 1.55;
letter-spacing: .02em;
color: #293117;
margin: 0 0 40px
}

.cntctus .formelem {
margin: 0 0 40px;
position: relative
}

.cntctus .inputwrap {
position: relative
}

.cntctus .formlbl {
position: absolute;
left: 16px;
top: 20px;
font-size: 15px;
line-height: 1.35;
letter-spacing: .02em;
color: #29311799;
pointer-events: none;
transition: all .65s cubic-bezier(0.4, 0, 0.2, 1);
background: #FFF;
padding: 0 8px
}

.cntctus .forminp {
width: 100%;
padding: 20px 16px;
font-size: 18px;
line-height: 1.55;
letter-spacing: .02em;
color: #293117;
background: #FFF;
border: 2px solid #7f09cb33;
border-radius: 6px;
outline: none;
transition: border-color .7s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .7s cubic-bezier(0.4, 0, 0.2, 1)
}

.cntctus .forminp:focus {
border-color: #7F09CB;
box-shadow: 0 3px 5px 0 #7f09cb0f 0 0 0 4px #7f09cb14
}

.cntctus .forminp:focus+.formlbl,
.cntctus .forminp:not(:placeholder-shown)+.formlbl {
top: -10px;
left: 12px;
font-size: 15px;
color: #7F09CB
}

.cntctus .formtxt {
width: 100%;
padding: 20px 16px;
font-size: 18px;
line-height: 1.55;
letter-spacing: .02em;
color: #293117;
background: #FFF;
border: 2px solid #7f09cb33;
border-radius: 6px;
outline: none;
resize: vertical;
min-height: 140px;
transition: border-color .7s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .7s cubic-bezier(0.4, 0, 0.2, 1);
font-family: inherit
}

.cntctus .formtxt:focus {
border-color: #7F09CB;
box-shadow: 0 3px 5px 0 #7f09cb0f 0 0 0 4px #7f09cb14
}

.cntctus .formtxt:focus+.formlbl,
.cntctus .formtxt:not(:placeholder-shown)+.formlbl {
top: -10px;
left: 12px;
font-size: 15px;
color: #7F09CB
}

.cntctus .radiohd {
font-size: 18px;
line-height: 1.55;
letter-spacing: .02em;
color: #293117;
margin: 0 0 16px;
font-weight: 600
}

.cntctus .radiogrp {
display: flex;
flex-direction: column;
gap: 16px
}

.cntctus .radiowrap {
position: relative;
display: flex;
align-items: center
}

.cntctus .radioinp {
position: absolute;
opacity: 0;
width: 0;
height: 0
}

.cntctus .radiolbl {
display: flex;
align-items: center;
font-size: 18px;
line-height: 1.55;
letter-spacing: .02em;
color: #293117;
cursor: pointer;
padding: 16px 16px 16px 56px;
border: 2px solid #7f09cb26;
border-radius: 6px;
width: 100%;
position: relative;
transition: all .6s cubic-bezier(0.4, 0, 0.2, 1);
background: #FFF
}

.cntctus .radiolbl::before {
content: '';
position: absolute;
left: 16px;
top: 50%;
transform: translateY(-50%);
width: 24px;
height: 24px;
border: 2px solid #7f09cb4d;
border-radius: 50%;
background: #FFF;
transition: all .6s cubic-bezier(0.4, 0, 0.2, 1)
}

.cntctus .radiolbl::after {
content: '';
position: absolute;
left: 22px;
top: 50%;
transform: translateY(-50%) scale(0);
width: 12px;
height: 12px;
border-radius: 50%;
background: #7F09CB;
transition: transform .65s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.cntctus .radioinp:checked+.radiolbl {
border-color: #7F09CB;
background: #7f09cb08;
box-shadow: 0 3px 5px 0 #7f09cb0f
}

.cntctus .radioinp:checked+.radiolbl::before {
border-color: #7F09CB
}

.cntctus .radioinp:checked+.radiolbl::after {
transform: translateY(-50%) scale(1)
}

.cntctus .radiolbl:hover {
border-color: #7F09CB;
background: #7f09cb05
}

.cntctus .chkwrap {
display: flex;
align-items: flex-start;
gap: 16px;
margin: 0 0 40px;
padding: 24px;
background: #FFF9E6;
border-radius: 6px;
border: 1px solid #7f09cb1a
}

.cntctus .chkinp {
position: absolute;
opacity: 0;
width: 0;
height: 0
}

.cntctus .chklbl {
display: flex;
align-items: flex-start;
font-size: 15px;
line-height: 1.55;
letter-spacing: .02em;
color: #293117;
cursor: pointer;
position: relative;
padding-left: 40px
}

.cntctus .chklbl::before {
content: '';
position: absolute;
left: 0;
top: 2px;
width: 24px;
height: 24px;
border: 2px solid #7f09cb4d;
border-radius: 6px;
background: #FFF;
transition: all .65s cubic-bezier(0.4, 0, 0.2, 1)
}

.cntctus .chklbl::after {
content: '';
position: absolute;
left: 7px;
top: 6px;
width: 10px;
height: 16px;
border: solid #FFF;
border-width: 0 3px 3px 0;
transform: rotate(45deg) scale(0);
transition: transform .7s cubic-bezier(0.34, 1.56, 0.64, 1)
}

.cntctus .chkinp:checked+.chklbl::before {
background: #7F09CB;
border-color: #7F09CB
}

.cntctus .chkinp:checked+.chklbl::after {
transform: rotate(45deg) scale(1)
}

.cntctus .chklbl:hover::before {
border-color: #7F09CB
}

.cntctus .privlink {
color: #7F09CB;
text-decoration: underline;
transition: color .6s cubic-bezier(0.4, 0, 0.2, 1)
}

.cntctus .privlink:hover {
color: #293117
}

.cntctus .submitwrap {
display: flex;
justify-content: flex-start
}

.cntctus .submitbtn {
padding: 20px 72px;
font-size: 18px;
line-height: 1.35;
letter-spacing: .02em;
color: #FFF;
background: linear-gradient(135deg, #7F09CB 0%, #293117 100%);
border: 2px solid transparent;
border-radius: 10px;
cursor: pointer;
font-weight: 600;
position: relative;
overflow: hidden;
transition: all .75s cubic-bezier(0.4, 0, 0.2, 1);
box-shadow: 0 5px 28px 0 #7f09cb17
}

.cntctus .submitbtn::before {
content: '';
position: absolute;
inset: 0;
border-radius: 8px;
padding: 2px;
background: linear-gradient(135deg, #fff9e666 0%, #fff9e61a 100%);
-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
-webkit-mask-composite: xor;
mask-composite: exclude;
opacity: 0;
transition: opacity .75s cubic-bezier(0.4, 0, 0.2, 1)
}

.cntctus .submitbtn:hover {
transform: translateY(-2px);
box-shadow: 0 9px 52px 0 #7f09cb24
}

.cntctus .submitbtn:hover::before {
opacity: 1
}

.cntctus .submitbtn:active {
transform: translateY(0)
}

.cntctus .contactinfo {
position: relative;
padding: 72px 24px;
background: #293117f7;
color: #FFF
}

.cntctus .contactinfo::before {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 6px;
background: linear-gradient(180deg, #7F09CB 0%, #FFF9E6 100%)
}

.cntctus .contactgrid {
max-width: 1100px;
margin: 0 auto;
display: grid;
grid-template-columns: 320px 1fr;
gap: 72px;
align-items: start
}

.cntctus .contacthd {
font-size: 42px;
line-height: 1.35;
letter-spacing: .015em;
color: #FFF9E6;
margin: 0 0 24px;
font-weight: 600
}

.cntctus .contactdesc {
font-size: 18px;
line-height: 1.55;
letter-spacing: .02em;
color: #fff9e6d9;
margin: 0
}

.cntctus .detaillist {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 24px
}

.cntctus .detailitem {
padding: 0 0 24px;
border-bottom: 1px solid #fff9e626;
position: relative
}

.cntctus .detaillbl {
font-size: 15px;
line-height: 1.35;
letter-spacing: .02em;
color: #fff9e699;
margin: 0 0 8px;
text-transform: uppercase
}

.cntctus .detailval {
font-size: 18px;
line-height: 1.55;
letter-spacing: .02em;
color: #FFF;
margin: 0
}

.cntctus .detailval a {
color: #FFF;
text-decoration: none;
transition: color .65s cubic-bezier(0.4, 0, 0.2, 1)
}

.cntctus .detailval a:hover {
color: #FFF9E6
}

.cntctus .detailitem::after {
content: '';
position: absolute;
right: 0;
top: 0;
bottom: 0;
width: 3px;
background: linear-gradient(180deg, transparent 0%, #7F09CB 50%, transparent 100%);
opacity: 0;
transition: opacity .7s cubic-bezier(0.4, 0, 0.2, 1)
}

.cntctus .detailitem:hover::after {
opacity: 1
}

@media (max-width: 1024px) {
.cntctus .initzone {
flex-direction: column;
gap: 40px;
padding: 40px 24px
}

.cntctus .imgcard {
width: 100%;
max-width: 480px;
height: 360px
}

.cntctus .txtdom {
padding: 24px
}

.cntctus .numaccent {
font-size: 56px
}

.cntctus .maintxt {
font-size: 32px
}

.cntctus .contactgrid {
grid-template-columns: 1fr;
gap: 40px
}

.cntctus .formsec {
padding: 40px 24px
}

.cntctus .formhd {
font-size: 32px
}

.cntctus .contactinfo {
padding: 40px 24px
}

.cntctus .contacthd {
font-size: 32px
}
}

@media (max-width: 640px) {
.cntctus .initzone {
padding: 24px 16px;
gap: 24px
}

.cntctus .imgcard {
height: 280px
}

.cntctus .txtdom {
padding: 16px
}

.cntctus .numaccent {
font-size: 42px
}

.cntctus .maintxt {
font-size: 22px
}

.cntctus .explan {
font-size: 15px
}

.cntctus .formsec {
padding: 24px 16px
}

.cntctus .formhd {
font-size: 22px;
padding: 12px 16px
}

.cntctus .formintro {
font-size: 15px
}

.cntctus .formelem {
margin: 0 0 24px
}

.cntctus .forminp,
.cntctus .formtxt,
.cntctus .radiolbl {
font-size: 15px;
padding: 16px
}

.cntctus .radiolbl {
padding-left: 48px
}

.cntctus .submitbtn {
width: 100%;
padding: 16px 24px;
font-size: 15px
}

.cntctus .contactinfo {
padding: 24px 16px
}

.cntctus .contacthd {
font-size: 22px
}

.cntctus .contactdesc,
.cntctus .detailval {
font-size: 15px
}

.cntctus .detaillist {
gap: 16px
}

.cntctus .detailitem {
padding: 0 0 16px
}
}

.rdmp {
background: #fff;
color: #293117;
letter-spacing: .015em
}

.rdmp .topanchor {
background: linear-gradient(180deg, #7F09CB 0%, #8e2fd4 100%);
padding: 104px 24px 56px;
position: relative;
overflow: hidden
}

.rdmp .topanchor::before {
content: '';
position: absolute;
top: 40px;
right: 80px;
width: 280px;
height: 280px;
border-radius: 50%;
border: 1px solid #ffffff1f;
pointer-events: none
}

.rdmp .topanchor::after {
content: '';
position: absolute;
top: 20px;
right: 60px;
width: 320px;
height: 320px;
border-radius: 50%;
border: 1px solid #ffffff14;
pointer-events: none
}

.rdmp .topframe {
max-width: 1320px;
margin: 0 auto;
position: relative;
z-index: 1
}

.rdmp .maintitle {
font-size: 72px;
line-height: 1.1;
color: #fff;
margin: 0 0 24px;
font-weight: 700
}

.rdmp .numaccent {
font-size: 72px;
color: #FFF9E6;
font-weight: 700;
display: inline-block;
margin-right: 16px
}

.rdmp .subtitle {
font-size: 22px;
line-height: 1.55;
color: #ffffffeb;
max-width: 680px;
margin: 0
}

.rdmp .journeyzone {
padding: 72px 24px;
background: #fff;
position: relative
}

.rdmp .journeyframe {
max-width: 1320px;
margin: 0 auto
}

.rdmp .phasetitle {
font-size: 42px;
line-height: 1.35;
color: #293117;
margin: 0 0 40px;
font-weight: 600
}

.rdmp .milestones {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 24px;
margin-bottom: 72px
}

.rdmp .milestone {
background: #fff;
border: 1px solid #7f09cb26;
border-radius: 10px;
padding: 24px;
position: relative;
overflow: hidden;
transition: transform .65s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .65s cubic-bezier(0.4, 0, 0.2, 1), border-color .65s cubic-bezier(0.4, 0, 0.2, 1);
box-shadow: 0 3px 5px 0 #7f09cb0f
}

.rdmp .milestone:hover {
transform: translateY(-4px);
box-shadow: 0 9px 52px 0 #7f09cb24;
border-color: #7f09cb4d
}

.rdmp .milestone::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 0;
height: 3px;
background: #7F09CB;
transition: width .75s cubic-bezier(0.4, 0, 0.2, 1)
}

.rdmp .milestone:hover::before {
width: 100%
}

.rdmp .milestone.accent {
background: linear-gradient(135deg, #7f09cb0a 0%, #fff9e666 100%);
border-color: #7F09CB
}

.rdmp .quarter {
font-size: 18px;
line-height: 1.35;
color: #7F09CB;
margin: 0 0 8px;
font-weight: 600;
letter-spacing: .02em
}

.rdmp .milestonelabel {
font-size: 22px;
line-height: 1.35;
color: #293117;
margin: 0 0 16px;
font-weight: 600
}

.rdmp .milestonedesc {
font-size: 15px;
line-height: 1.55;
color: #293117d1;
margin: 0
}

.rdmp .dividerline {
height: 1px;
background: repeating-linear-gradient(to right, #7f09cb33 0px, #7f09cb33 8px, transparent 8px, transparent 16px);
margin: 72px 0
}

.rdmp .detailgrid {
display: grid;
grid-template-columns: 1fr 2fr 1fr;
gap: 40px;
align-items: start
}

.rdmp .statuscard {
background: #FFF9E6;
border-radius: 10px;
padding: 24px;
border: 1px solid #7f09cb1a
}

.rdmp .statuslabel {
font-size: 18px;
line-height: 1.35;
color: #293117;
margin: 0 0 16px;
font-weight: 600;
background: #7F09CB;
color: #fff;
padding: 8px 16px;
display: inline-block;
border-radius: 6px
}

.rdmp .indicators {
display: flex;
flex-direction: column;
gap: 16px
}

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

.rdmp .indicatorname {
font-size: 15px;
line-height: 1.35;
color: #293117;
margin: 0;
font-weight: 500
}

.rdmp .levelbar {
height: 8px;
background: #7f09cb1a;
border-radius: 6px;
overflow: hidden;
position: relative
}

.rdmp .levelfill {
height: 100%;
background: linear-gradient(90deg, #7F09CB 0%, #293117 100%);
border-radius: 6px;
transition: width .85s cubic-bezier(0.4, 0, 0.2, 1)
}

.rdmp .levelfill.high {
width: 85%;
background: linear-gradient(90deg, #7F09CB 0%, #5a0a8c 100%)
}

.rdmp .levelfill.medium {
width: 60%;
background: linear-gradient(90deg, #7F09CB 0%, #9a3dd9 100%)
}

.rdmp .levelfill.moderate {
width: 40%;
background: linear-gradient(90deg, #9a3dd9 0%, #b87ee6 100%)
}

.rdmp .centralcontent {
display: flex;
flex-direction: column;
gap: 24px
}

.rdmp .narrative {
background: #fff;
border-left: 3px solid #7F09CB;
padding: 0 0 0 24px
}

.rdmp .narrativeheading {
font-size: 22px;
line-height: 1.35;
color: #293117;
margin: 0 0 16px;
font-weight: 600
}

.rdmp .narrativetext {
font-size: 15px;
line-height: 1.55;
color: #293117d9;
margin: 0 0 16px
}

.rdmp .narrativetext:last-child {
margin: 0
}

.rdmp .imgwrap {
width: 100%;
height: 320px;
border-radius: 10px;
overflow: hidden;
box-shadow: 0 5px 28px 0 #7f09cb17
}

.rdmp .imgwrap img {
width: 100%;
height: 100%;
object-fit: cover;
display: block
}

.rdmp .metricbox {
background: linear-gradient(180deg, #fff 0%, #fff9e64d 100%);
border-radius: 10px;
padding: 24px;
border: 1px solid #7f09cb26
}

.rdmp .metriclabel {
font-size: 18px;
line-height: 1.35;
color: #7F09CB;
margin: 0 0 16px;
font-weight: 600;
letter-spacing: .02em
}

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

.rdmp .metriclist li {
padding-bottom: 16px;
border-bottom: 1px solid #7f09cb1a;
display: flex;
flex-direction: column;
gap: 8px
}

.rdmp .metriclist li:last-child {
border-bottom: none;
padding-bottom: 0
}

.rdmp .metricitem {
font-size: 15px;
line-height: 1.35;
color: #293117;
margin: 0;
font-weight: 500
}

.rdmp .metricvalue {
font-size: 22px;
line-height: 1.1;
color: #7F09CB;
font-weight: 700
}

.rdmp .blueprintzone {
padding: 72px 24px;
background: linear-gradient(180deg, #fff 0%, #fff9e626 100%);
position: relative
}

.rdmp .blueprintzone::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: linear-gradient(#7f09cb08 1px, transparent 1px), linear-gradient(90deg, #7f09cb08 1px, transparent 1px);
background-size: 40px 40px;
pointer-events: none;
opacity: .4
}

.rdmp .blueprintframe {
max-width: 1320px;
margin: 0 auto;
position: relative;
z-index: 1
}

.rdmp .phasetitle.second {
margin-bottom: 40px
}

.rdmp .timelinewrap {
display: flex;
flex-direction: column;
gap: 40px
}

.rdmp .timelineitem {
display: grid;
grid-template-columns: 180px 1fr;
gap: 40px;
align-items: start;
position: relative
}

.rdmp .timelineitem::before {
content: '';
position: absolute;
left: 90px;
top: 60px;
bottom: -40px;
width: 2px;
background: linear-gradient(180deg, #7F09CB 0%, #7f09cb33 100%)
}

.rdmp .timelineitem:last-child::before {
display: none
}

.rdmp .periodbox {
background: #7F09CB;
color: #fff;
border-radius: 10px;
padding: 16px 24px;
text-align: center;
position: relative;
z-index: 1;
box-shadow: 0 5px 28px 0 #7f09cb17
}

.rdmp .periodlabel {
font-size: 18px;
line-height: 1.35;
margin: 0;
font-weight: 600
}

.rdmp .contentbox {
background: #fff;
border-radius: 10px;
padding: 24px;
border: 1px solid #7f09cb26;
box-shadow: 0 3px 5px 0 #7f09cb0f
}

.rdmp .contentheading {
font-size: 22px;
line-height: 1.35;
color: #293117;
margin: 0 0 16px;
font-weight: 600
}

.rdmp .contentdesc {
font-size: 15px;
line-height: 1.55;
color: #293117d9;
margin: 0 0 16px
}

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

.rdmp .deliverables li {
padding-left: 24px;
position: relative;
font-size: 15px;
line-height: 1.55;
color: #293117d1
}

.rdmp .deliverables li::before {
content: '';
position: absolute;
left: 0;
top: 10px;
width: 8px;
height: 8px;
background: #7F09CB;
border-radius: 50%
}

@media (max-width: 1024px) {
.rdmp .milestones {
grid-template-columns: repeat(2, 1fr)
}

.rdmp .detailgrid {
grid-template-columns: 1fr
}

.rdmp .timelineitem {
grid-template-columns: 1fr;
gap: 24px
}

.rdmp .timelineitem::before {
display: none
}

.rdmp .periodbox {
max-width: 200px
}
}

@media (max-width: 768px) {
.rdmp .maintitle {
font-size: 42px
}

.rdmp .numaccent {
font-size: 42px
}

.rdmp .subtitle {
font-size: 18px
}

.rdmp .phasetitle {
font-size: 22px
}

.rdmp .milestones {
grid-template-columns: 1fr
}

.rdmp .topanchor {
padding: 72px 24px 40px
}

.rdmp .journeyzone,
.rdmp .blueprintzone {
padding: 40px 24px
}

.rdmp .imgwrap {
height: 240px
}
}

.successpage {
background: linear-gradient(135deg, #FFF9E6 0%, #fff 100%);
min-height: 100vh;
padding: 72px 24px
}

.successpage .successwrap {
max-width: 1320px;
margin: 0 auto
}

.successpage .confirmsection {
background: #fff;
border-radius: 10px;
box-shadow: 0 5px 28px 0 #7f09cb17;
margin-bottom: 40px;
padding: 72px 40px;
text-align: center
}

.successpage .iconcheck {
align-items: center;
background: radial-gradient(ellipse at center, #7F09CB 0%, #293117 100%);
border-radius: 50%;
display: flex;
height: 96px;
justify-content: center;
margin: 0 auto 40px;
width: 96px
}

.successpage .iconcheck svg {
fill: none;
height: 48px;
stroke: #FFF9E6;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 3;
width: 48px
}

.successpage .confirmhead {
color: #293117;
font-size: 42px;
letter-spacing: .01em;
line-height: 1.1;
margin-bottom: 24px
}

.successpage .confirmtext {
color: #293117;
font-size: 18px;
letter-spacing: .02em;
line-height: 1.55;
margin-bottom: 0
}

.successpage .detailssection {
background: #fff;
border-radius: 10px;
box-shadow: 0 3px 5px 0 #7f09cb0f;
margin-bottom: 40px;
padding: 40px
}

.successpage .detailshead {
background: linear-gradient(135deg, #7F09CB 0%, #fff 100%);
border-radius: 6px;
color: #fff;
display: inline-block;
font-size: 22px;
letter-spacing: .01em;
line-height: 1.35;
margin-bottom: 24px;
padding: 8px 16px
}

.successpage .detailslist {
list-style: none;
margin: 0;
padding: 0
}

.successpage .detailslist li {
border-bottom: 1px solid #7f09cb26;
color: #293117;
font-size: 18px;
letter-spacing: .02em;
line-height: 1.55;
padding: 16px 0
}

.successpage .detailslist li:last-child {
border-bottom: none
}

.successpage .detaillabel {
color: #7F09CB;
font-size: 15px;
letter-spacing: .02em;
line-height: 1.35;
margin-bottom: 8px
}

.successpage .nextsection {
background: radial-gradient(ellipse at center, #7F09CB 0%, #293117 100%);
border-radius: 10px;
box-shadow: 0 9px 52px 0 #7f09cb24;
padding: 40px
}

.successpage .nexthead {
color: #FFF9E6;
font-size: 22px;
letter-spacing: .01em;
line-height: 1.35;
margin-bottom: 24px
}

.successpage .nexttext {
color: #FFF9E6;
font-size: 18px;
letter-spacing: .02em;
line-height: 1.55;
margin-bottom: 40px
}

.successpage .actionrow {
align-items: center;
display: flex;
flex-direction: column;
gap: 16px
}

.successpage .primarybtn {
background: linear-gradient(135deg, #FFF9E6 0%, #fff 100%);
border: 2px solid transparent;
border-radius: 6px;
color: #293117;
cursor: pointer;
font-size: 18px;
letter-spacing: .02em;
padding: 16px 40px;
position: relative;
text-decoration: none;
transition: border-color .7s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .7s cubic-bezier(0.4, 0, 0.2, 1)
}

.successpage .primarybtn:hover {
border-color: #FFF9E6;
box-shadow: 0 5px 28px 0 #fff9e64d
}

.successpage .secondarybtn {
background: transparent;
border: 2px solid #FFF9E6;
border-radius: 6px;
color: #FFF9E6;
cursor: pointer;
font-size: 18px;
letter-spacing: .02em;
padding: 16px 40px;
text-decoration: none;
transition: background .65s cubic-bezier(0.4, 0, 0.2, 1), border-color .65s cubic-bezier(0.4, 0, 0.2, 1)
}

.successpage .secondarybtn:hover {
background: #fff9e61a;
border-color: #fff
}

@media (min-width: 768px) {
.successpage .actionrow {
flex-direction: row;
gap: 24px;
justify-content: center
}
}

@media (min-width: 1024px) {
.successpage .confirmsection {
padding: 72px
}

.successpage .detailssection {
padding: 40px 72px
}

.successpage .nextsection {
padding: 40px 72px
}
}