@import "https://cdn.jsdelivr.net/npm/@fontsource/arimo@latest/400.css";
@import "https://cdn.jsdelivr.net/npm/@fontsource/arimo@latest/400-italic.css";
@import "https://cdn.jsdelivr.net/npm/@fontsource/arimo@latest/700.css";
@import "https://cdn.jsdelivr.net/npm/@fontsource/arimo@latest/700-italic.css";
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Arimo',-apple-system,BlinkMacSystemFont,sans-serif;font-size:16px;line-height:1.6;color:#1a1a1a;background:#F6F7F8}
img{max-width:100%;height:auto;display:block}
.pageHeader{background:linear-gradient(135deg,#fff 0%,#F6F7F8 100%);padding:28px 0;box-shadow:0 4px 12px #5d75d314}
.pageHeader .headerInnerBox{max-width:1366px;margin:0 auto;padding:0 24px}
.pageHeader .topRowBox{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.pageHeader .brandingBox{display:flex;align-items:center;gap:18px}
.pageHeader .logoImageWrapper{width:92px;height:92px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:24px;box-shadow:0 6px 16px #5d75d31f}
.pageHeader .logoImageWrapper img{width:70px;height:70px}
.pageHeader .companyNameText{font-size:26px;font-weight:700;color:#5D75D3;letter-spacing:-.02em}
.pageHeader .mainNavigation{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;align-items:center}
.pageHeader .mainNavigation a{padding:12px 20px;color:#2a2a2a;text-decoration:none;font-size:15px;font-weight:400;border-radius:20px;transition:background 180ms ease,color 180ms ease;white-space:nowrap}
.pageHeader .mainNavigation a:hover{background:#5D75D3;color:#fff}
.pageFooter{background:#fff;padding:48px 0 32px;margin-top:80px;border-top:3px dashed #5D75D3}
.pageFooter .footerContainer{max-width:1366px;margin:0 auto;padding:0 24px}
.pageFooter .footerTopSection{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:48px;margin-bottom:40px}
.pageFooter .companyInfoColumn h3{font-size:22px;font-weight:700;color:#5D75D3;margin-bottom:16px}
.pageFooter .companyInfoColumn p{font-size:14px;line-height:1.7;color:#4a4a4a;margin-bottom:12px}
.pageFooter .contactDetailsBox{display:flex;flex-direction:column;gap:10px;margin-top:20px}
.pageFooter .contactDetailsBox a{color:#2a2a2a;text-decoration:none;font-size:14px;transition:color 160ms ease}
.pageFooter .contactDetailsBox a:hover{color:#5D75D3}
.pageFooter .linksColumn h4{font-size:16px;font-weight:700;color:#2a2a2a;margin-bottom:16px}
.pageFooter .linksList{display:flex;flex-direction:column;gap:10px;list-style:none}
.pageFooter .linksList a{color:#4a4a4a;text-decoration:none;font-size:14px;transition:color 160ms ease}
.pageFooter .linksList a:hover{color:#5D75D3}
.pageFooter .footerBottomBar{padding-top:28px;border-top:1px solid #e0e0e0;text-align:center;color:#6a6a6a;font-size:13px}
.cookieConsentModal{position:fixed;bottom:0;left:50%;transform:translateX(-50%) translateY(120%);width:70%;max-width:920px;background:#fff;border-radius:28px 28px 0 0;box-shadow:0 -8px 32px #5d75d333;padding:32px;z-index:9999;transition:transform 400ms cubic-bezier(0.4,0,0.2,1);border-left:6px solid #5D75D3}
.cookieConsentModal[data-visible="true"]{transform:translateX(-50%) translateY(0)}
.cookieConsentModal .modalHeaderText{font-size:22px;font-weight:700;color:#2a2a2a;margin-bottom:14px}
.cookieConsentModal .modalDescriptionText{font-size:14px;line-height:1.6;color:#4a4a4a;margin-bottom:24px}
.cookieConsentModal .categoriesGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:28px}
.cookieConsentModal .categoryCard{background:#F6F7F8;padding:18px;border-radius:18px;border:2px solid transparent;transition:border-color 200ms ease}
.cookieConsentModal .categoryCard:hover{border-color:#5D75D3}
.cookieConsentModal .categoryCard h4{font-size:15px;font-weight:700;color:#2a2a2a;margin-bottom:8px}
.cookieConsentModal .categoryCard p{font-size:13px;color:#6a6a6a;line-height:1.5}
.cookieConsentModal .actionsRow{display:flex;gap:20px;justify-content:center}
.cookieConsentModal .actionButton{padding:14px 32px;background:none;border:none;font-family:'Arimo',sans-serif;font-size:15px;font-weight:700;cursor:pointer;border-radius:22px;transition:background 180ms ease,color 180ms ease}
.cookieConsentModal .acceptAllBtn{background:#5D75D3;color:#fff}
.cookieConsentModal .acceptAllBtn:hover{background:#4a5fb5}
.cookieConsentModal .declineAllBtn{color:#5D75D3;text-decoration:underline}
.cookieConsentModal .declineAllBtn:hover{background:#F6F7F8;text-decoration:none}
@media (max-width: 768px) {
.pageHeader .topRowBox{flex-direction:column;align-items:stretch;gap:20px}
.pageHeader .mainNavigation{justify-content:center;gap:6px}
.pageHeader .mainNavigation a{padding:10px 14px;font-size:14px}
.pageFooter .footerTopSection{grid-template-columns:1fr;gap:32px}
.cookieConsentModal{width:90%;padding:24px}
.cookieConsentModal .categoriesGrid{grid-template-columns:1fr}
.cookieConsentModal .actionsRow{flex-direction:column}
}
@media (max-width: 1024px) {
.pageHeader .mainNavigation{gap:6px}
.pageHeader .mainNavigation a{padding:10px 16px;font-size:14px}
}
.rules-text{max-width:1366px;margin:0 auto;padding:60px 24px;background:#FFF}
@media (min-width: 768px) {
.rules-text{padding:80px 40px}
}
@media (min-width: 1024px) {
.rules-text{padding:100px 60px}
}
.rules-text h1{font-size:32px;line-height:1.2;font-weight:700;color:#1a1a1a;margin:0 0 40px;padding-bottom:20px;border-bottom:3px solid #5D75D3}
@media (min-width: 768px) {
.rules-text h1{font-size:42px;margin-bottom:50px}
}
@media (min-width: 1024px) {
.rules-text h1{font-size:48px;margin-bottom:60px}
}
.rules-text h2{font-size:24px;line-height:1.3;font-weight:600;color:#2a2a2a;margin:50px 0 24px;padding-left:16px;border-left:4px solid #5D75D3}
@media (min-width: 768px) {
.rules-text h2{font-size:30px;margin-top:60px;padding-left:20px}
}
@media (min-width: 1024px) {
.rules-text h2{font-size:36px;margin-top:70px}
}
.rules-text h3{font-size:20px;line-height:1.4;font-weight:600;color:#3a3a3a;margin:40px 0 18px}
@media (min-width: 768px) {
.rules-text h3{font-size:24px;margin-top:45px}
}
@media (min-width: 1024px) {
.rules-text h3{font-size:28px;margin-top:50px}
}
.rules-text h4{font-size:18px;line-height:1.4;font-weight:600;color:#4a4a4a;margin:32px 0 16px}
@media (min-width: 768px) {
.rules-text h4{font-size:20px}
}
@media (min-width: 1024px) {
.rules-text h4{font-size:22px}
}
.rules-text h5{font-size:16px;line-height:1.5;font-weight:600;color:#5a5a5a;margin:28px 0 14px}
@media (min-width: 768px) {
.rules-text h5{font-size:18px}
}
.rules-text h6{font-size:15px;line-height:1.5;font-weight:600;color:#6a6a6a;margin:24px 0 12px}
@media (min-width: 768px) {
.rules-text h6{font-size:16px}
}
.rules-text p{font-size:16px;line-height:1.75;color:#2a2a2a;margin:0 0 20px}
@media (min-width: 768px) {
.rules-text p{font-size:17px;line-height:1.8;margin-bottom:24px}
}
@media (min-width: 1024px) {
.rules-text p{font-size:18px;line-height:1.85}
}
.rules-text ul,.rules-text ol{margin:0 0 24px;padding-left:28px}
@media (min-width: 768px) {
.rules-text ul,.rules-text ol{padding-left:32px;margin-bottom:28px}
}
@media (min-width: 1024px) {
.rules-text ul,.rules-text ol{padding-left:36px}
}
.rules-text ul{list-style-type:none}
.rules-text ul li{position:relative;padding-left:24px;margin-bottom:14px;font-size:16px;line-height:1.7;color:#2a2a2a}
@media (min-width: 768px) {
.rules-text ul li{font-size:17px;margin-bottom:16px}
}
@media (min-width: 1024px) {
.rules-text ul li{font-size:18px}
}
.rules-text ul li::before{content:'';position:absolute;left:0;top:11px;width:8px;height:8px;background:#5D75D3;border-radius:50%}
@media (min-width: 768px) {
.rules-text ul li::before{top:12px}
}
.rules-text ol{list-style-type:decimal;counter-reset:item}
.rules-text ol li{margin-bottom:14px;font-size:16px;line-height:1.7;color:#2a2a2a;padding-left:8px}
@media (min-width: 768px) {
.rules-text ol li{font-size:17px;margin-bottom:16px}
}
@media (min-width: 1024px) {
.rules-text ol li{font-size:18px}
}
.rules-text em,.rules-text i{font-style:italic;color:#3a3a3a}
.rules-text strong,.rules-text b{font-weight:600;color:#1a1a1a}
.rules-text a{color:#5D75D3;text-decoration:underline;text-decoration-style:dotted;text-decoration-thickness:1px;text-underline-offset:3px;transition:all 300ms ease}
.rules-text a:hover{color:#3a4d9e;text-decoration-style:solid;text-decoration-thickness:2px}
.rules-text a:focus{outline:2px solid #5D75D3;outline-offset:4px;border-radius:4px}
.rules-text div{margin-bottom:20px}
.rules-text div p:last-child{margin-bottom:0}
.rules-text table{width:100%;border-collapse:collapse;margin:30px 0;background:#F6F7F8;border-radius:16px;overflow:hidden}
@media (min-width: 768px) {
.rules-text table{margin:40px 0}
}
.rules-text table th,.rules-text table td{padding:14px 16px;text-align:left;border-bottom:1px dashed #d0d0d0;font-size:15px;line-height:1.6}
@media (min-width: 768px) {
.rules-text table th,.rules-text table td{padding:16px 20px;font-size:16px}
}
.rules-text table th{background:#5D75D3;color:#FFF;font-weight:600;border-bottom:none}
.rules-text table td{color:#2a2a2a}
.rules-text table tr:last-child td{border-bottom:none}
.rules-text hr{border:none;height:2px;background:linear-gradient(to right,#5D75D3,#FCE900,#F6F7F8);margin:50px 0;border-radius:2px}
@media (min-width: 768px) {
.rules-text hr{margin:60px 0}
}
@media (min-width: 1024px) {
.rules-text hr{margin:70px 0}
}
.rules-text blockquote{margin:30px 0;padding:24px 24px 24px 20px;background:#F6F7F8;border-left:4px solid #FCE900;border-radius:0 16px 16px 0;font-style:italic;color:#3a3a3a}
@media (min-width: 768px) {
.rules-text blockquote{padding:28px 32px 28px 24px;margin:40px 0}
}
.rules-text blockquote p{margin-bottom:0}
.rules-text code{background:#F6F7F8;padding:3px 8px;border-radius:6px;font-family:'Courier New',monospace;font-size:14px;color:#5D75D3;border:1px dashed #d0d0d0}
@media (min-width: 768px) {
.rules-text code{font-size:15px;padding:4px 10px}
}
.mainLayout{max-width:1366px;margin:0 auto;padding:0}
.heroContainer{display:flex;align-items:center;gap:40px;padding:80px 20px;position:relative;overflow:hidden}
.heroContainer::before{content:'';position:absolute;width:600px;height:600px;border:3px solid #5D75D3;border-radius:60% 40% 30% 70% / 60% 30% 70% 40%;top:-200px;right:-150px;opacity:.15;z-index:0}
.heroContainer::after{content:'';position:absolute;width:400px;height:400px;border:2px dashed #FCE900;border-radius:40% 60% 70% 30% / 30% 60% 40% 70%;bottom:-100px;left:-80px;opacity:.12;z-index:0}
.heroTextBox{flex:1;z-index:1}
.heroHeadingMain{font-size:56px;line-height:1.15;margin:0 0 32px;color:#1a1a1a;font-weight:700;letter-spacing:-.02em}
.heroLinkPrimary{display:inline-flex;align-items:center;gap:10px;background:linear-gradient(135deg,#5D75D3 0%,#4a5fb8 100%);color:#fff;padding:18px 36px;border-radius:28px;text-decoration:none;font-size:18px;font-weight:600;box-shadow:0 8px 20px #5d75d340;transition:all 280ms ease}
.heroLinkPrimary:hover{transform:translateY(-3px);box-shadow:0 12px 28px #5d75d359}
.heroLinkPrimary::after{content:'→';font-size:20px;transition:transform 200ms ease}
.heroLinkPrimary:hover::after{transform:translateX(5px)}
.heroImageBox{flex:1;position:relative;z-index:1}
.heroMainImage{width:100%;height:520px;object-fit:cover;border-radius:24px;box-shadow:0 16px 40px #0000001f;position:relative}
.heroMainImage::before{content:'';position:absolute;inset:0;border-radius:24px;background:linear-gradient(135deg,#5d75d314 0%,transparent 60%);pointer-events:none}
.heroImageBox::after{content:'';position:absolute;inset:12px;border-radius:24px;box-shadow:inset 0 0 60px #0000002e;pointer-events:none}
.pathContainer{padding:100px 20px;background:linear-gradient(160deg,#F6F7F8 0%,#fff 100%)}
.pathContentWrapper{max-width:1100px;margin:0 auto}
.pathTitleRow{text-align:center;margin-bottom:70px}
.pathMainHeading{font-size:44px;line-height:1.25;color:#1a1a1a;margin:0 0 18px;font-weight:700}
.pathDescriptionText{font-size:19px;line-height:1.6;color:#4a4a4a;max-width:760px;margin:0 auto}
.pathStepsGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.pathStepCard{background:#fff;padding:40px 32px;border-radius:20px;border-left:5px solid #5D75D3;box-shadow:0 6px 24px #00000012;transition:all 300ms ease;position:relative}
.pathStepCard:nth-child(2){border-left-color:#FCE900}
.pathStepCard:nth-child(3){border-left-color:#F6F7F8;border-left-width:5px;border-left-style:solid}
.pathStepCard:hover{transform:translateY(-8px);box-shadow:0 12px 36px #5d75d324}
.pathStepNumber{display:inline-block;width:48px;height:48px;background:linear-gradient(135deg,#5D75D3 0%,#7a8ee0 100%);color:#fff;border-radius:50%;text-align:center;line-height:48px;font-size:22px;font-weight:700;margin-bottom:24px;box-shadow:0 4px 12px #5d75d340}
.pathStepCard:nth-child(2) .pathStepNumber{background:linear-gradient(135deg,#FCE900 0%,#e6d400 100%);color:#2a2a2a}
.pathStepCard:nth-child(3) .pathStepNumber{background:linear-gradient(135deg,#4a4a4a 0%,#6a6a6a 100%);color:#fff}
.pathStepTitle{font-size:24px;line-height:1.35;color:#1a1a1a;margin:0 0 16px;font-weight:600}
.pathStepDescription{font-size:16px;line-height:1.65;color:#5a5a5a;margin:0 0 24px}
.pathStepList{list-style:none;padding:0;margin:0}
.pathStepList li{font-size:15px;line-height:1.7;color:#4a4a4a;padding-left:26px;position:relative;margin-bottom:10px}
.pathStepList li::before{content:'◆';position:absolute;left:0;color:#5D75D3;font-size:12px}
.pathStepCard:nth-child(2) .pathStepList li::before{color:#FCE900}
.pathStepCard:nth-child(3) .pathStepList li::before{color:#4a4a4a}
.connectionsContainer{padding:100px 20px;background:#fff}
.connectionsInner{max-width:1200px;margin:0 auto}
.connectionsSectionTitle{font-size:42px;line-height:1.3;color:#1a1a1a;margin:0 0 60px;font-weight:700;text-align:center}
.connectionsLayoutBox{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}
.connectionsTextColumn{display:flex;flex-direction:column;gap:32px}
.connectionsParagraph{font-size:17px;line-height:1.75;color:#3a3a3a;margin:0}
.connectionsParagraph strong{color:#5D75D3;font-weight:600}
.connectionsHighlightBox{background:linear-gradient(135deg,#F6F7F8 0%,#fff 100%);padding:28px 32px;border-radius:18px;border:2px dashed #5D75D3;margin-top:12px}
.connectionsHighlightBox p{font-size:16px;line-height:1.7;color:#2a2a2a;margin:0}
.connectionsVisualColumn{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.connectionsImageItem{border-radius:16px;overflow:hidden;box-shadow:0 8px 24px #0000001a;transition:transform 320ms ease}
.connectionsImageItem:hover{transform:scale(1.05)}
.connectionsImageItem img{width:100%;height:240px;object-fit:cover;display:block}
.connectionsImageItem:nth-child(1){grid-column:span 2}
.connectionsImageItem:nth-child(1) img{height:280px}
.connectionsBottomRow{margin-top:50px;display:flex;gap:40px;align-items:center}
.connectionsProfileBox{display:flex;gap:20px;align-items:center;flex:1}
.connectionsProfileImage{width:80px;height:80px;border-radius:50%;object-fit:cover;border:4px solid #FCE900;box-shadow:0 4px 16px #0000001f}
.connectionsProfileInfo{flex:1}
.connectionsProfileName{font-size:20px;font-weight:600;color:#1a1a1a;margin:0 0 6px}
.connectionsProfileRole{font-size:15px;color:#6a6a6a;margin:0}
.connectionsCtaLink{display:inline-flex;align-items:center;gap:12px;background:#5D75D3;color:#fff;padding:16px 32px;border-radius:24px;text-decoration:none;font-size:17px;font-weight:600;box-shadow:0 6px 18px #5d75d34d;transition:all 260ms ease}
.connectionsCtaLink:hover{background:#4a5fb8;transform:translateY(-2px);box-shadow:0 10px 26px #5d75d366}
.connectionsCtaLink::after{content:'→';font-size:18px}
@media (max-width: 1024px) {
.heroContainer{flex-direction:column;padding:60px 20px}
.heroHeadingMain{font-size:42px}
.heroMainImage{height:400px}
.pathStepsGrid{grid-template-columns:1fr}
.connectionsLayoutBox{grid-template-columns:1fr;gap:40px}
.connectionsBottomRow{flex-direction:column;align-items:stretch}
}
@media (max-width: 768px) {
.heroHeadingMain{font-size:36px;margin-bottom:24px}
.heroLinkPrimary{padding:14px 28px;font-size:16px}
.heroMainImage{height:320px}
.pathContainer{padding:70px 20px}
.pathMainHeading{font-size:34px}
.pathDescriptionText{font-size:17px}
.pathStepCard{padding:32px 24px}
.connectionsSectionTitle{font-size:34px;margin-bottom:40px}
.connectionsVisualColumn{grid-template-columns:1fr}
.connectionsImageItem:nth-child(1){grid-column:span 1}
.connectionsImageItem img{height:220px}
.connectionsImageItem:nth-child(1) img{height:260px}
.connectionsProfileBox{flex-direction:column;text-align:center}
}
.aboutTitleSection{padding:80px 20px 60px;max-width:1366px;margin:0 auto;position:relative}
.aboutTitleSection .titleWrapperBox{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;align-items:stretch}
.aboutTitleSection .textContentBox{grid-column:1 / 7;display:flex;flex-direction:column;justify-content:center;padding:40px;background:linear-gradient(135deg,#F6F7F8 0%,#fff 100%);border-radius:24px;border-left:4px solid #5D75D3;position:relative;overflow:hidden}
.aboutTitleSection .textContentBox::before{content:'';position:absolute;top:0;right:0;width:120px;height:120px;background:radial-gradient(circle,#fce90026 0%,transparent 70%);border-radius:50%;animation:patternReveal 1.2s ease-out forwards;opacity:0}
@keyframes patternReveal {
to{opacity:1;transform:scale(1.5)}
}
.aboutTitleSection .mainTitleText{font-size:56px;font-weight:700;line-height:1.1;color:#1a1a1a;margin:0 0 20px;letter-spacing:-1px;animation:letterSpacing 1s ease-out forwards}
@keyframes letterSpacing {
from{letter-spacing:8px;opacity:0}
to{letter-spacing:-1px;opacity:1}
}
.aboutTitleSection .subtitleDescription{font-size:18px;line-height:1.6;color:#4a4a4a;margin:0}
.aboutTitleSection .imageMosaicBox{grid-column:7 / 13;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);gap:16px;min-height:400px}
.aboutTitleSection .mosaicImageWrapper{position:relative;border-radius:20px;overflow:hidden;box-shadow:0 6px 18px #5d75d31f}
.aboutTitleSection .mosaicImageWrapper:first-child{grid-row:1 / 3}
.aboutTitleSection .mosaicImageWrapper img{width:100%;height:100%;object-fit:cover;display:block;position:relative}
.aboutTitleSection .mosaicImageWrapper::after{content:'';position:absolute;bottom:0;left:0;right:0;height:60%;background:linear-gradient(to bottom,transparent 0%,#0006 100%);pointer-events:none;animation:darkenBottom .8s ease-out forwards;opacity:0}
@keyframes darkenBottom {
to{opacity:1}
}
.storyContentSection{padding:100px 20px;background:#fff;position:relative}
.storyContentSection .contentLimitBox{max-width:1366px;margin:0 auto}
.storyContentSection .narrativeGridBox{display:grid;grid-template-columns:2fr 3fr;gap:80px;align-items:start}
.storyContentSection .sideImageColumn{position:sticky;top:100px}
.storyContentSection .sideImageColumn img{width:100%;height:auto;border-radius:28px;box-shadow:0 12px 32px #5d75d32e;border:3px dashed #FCE900}
.storyContentSection .textFlowColumn h2{font-size:42px;font-weight:700;line-height:1.2;color:#1a1a1a;margin:0 0 28px;position:relative;padding-left:24px}
.storyContentSection .textFlowColumn h2::before{content:'';position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(to bottom,#5D75D3 0%,#FCE900 100%);border-radius:3px}
.storyContentSection .textFlowColumn p{font-size:17px;line-height:1.8;color:#3a3a3a;margin:0 0 24px}
.storyContentSection .textFlowColumn p:last-child{margin-bottom:0}
.approachDetailsSection{padding:90px 20px;background:linear-gradient(165deg,#F6F7F8 0%,#fff 50%,#F6F7F8 100%);position:relative}
.approachDetailsSection .containerBoundary{max-width:1366px;margin:0 auto}
.approachDetailsSection .sectionHeaderBox{text-align:center;margin-bottom:70px}
.approachDetailsSection .sectionHeaderBox h2{font-size:48px;font-weight:700;line-height:1.2;color:#1a1a1a;margin:0 0 16px}
.approachDetailsSection .sectionHeaderBox p{font-size:19px;line-height:1.6;color:#4a4a4a;margin:0;max-width:700px;margin-left:auto;margin-right:auto}
.approachDetailsSection .cardsLayoutGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:32px}
.approachDetailsSection .featureCardBox{background:#fff;padding:40px 32px;border-radius:24px;border-left:5px solid transparent;box-shadow:0 4px 16px #5d75d314;transition:all .3s ease;position:relative}
.approachDetailsSection .featureCardBox:nth-child(1){border-left-color:#5D75D3}
.approachDetailsSection .featureCardBox:nth-child(2){border-left-color:#FCE900}
.approachDetailsSection .featureCardBox:nth-child(3){border-left-color:#5D75D3}
.approachDetailsSection .featureCardBox:hover{transform:translateY(-8px);box-shadow:0 12px 28px #5d75d329}
.approachDetailsSection .featureCardBox .iconWrapperCircle{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,#5D75D3 0%,#FCE900 100%);display:flex;align-items:center;justify-content:center;margin-bottom:24px}
.approachDetailsSection .featureCardBox .iconWrapperCircle svg{width:32px;height:32px;fill:#fff}
.approachDetailsSection .featureCardBox h3{font-size:24px;font-weight:700;line-height:1.3;color:#1a1a1a;margin:0 0 16px}
.approachDetailsSection .featureCardBox p{font-size:16px;line-height:1.7;color:#4a4a4a;margin:0}
.teamShowcaseSection{padding:100px 20px;background:#fff;position:relative}
.teamShowcaseSection::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(to right,transparent 0%,#5D75D3 50%,transparent 100%)}
.teamShowcaseSection .boundaryWrapper{max-width:1366px;margin:0 auto}
.teamShowcaseSection .introHeaderBlock{max-width:800px;margin:0 auto 60px;text-align:center}
.teamShowcaseSection .introHeaderBlock h2{font-size:46px;font-weight:700;line-height:1.2;color:#1a1a1a;margin:0 0 20px}
.teamShowcaseSection .introHeaderBlock p{font-size:18px;line-height:1.7;color:#4a4a4a;margin:0}
.teamShowcaseSection .profilesFlexContainer{display:flex;gap:48px;justify-content:center;flex-wrap:wrap}
.teamShowcaseSection .personCardBox{background:linear-gradient(145deg,#F6F7F8 0%,#fff 100%);border-radius:28px;padding:36px;max-width:380px;text-align:center;box-shadow:0 8px 24px #5d75d31a;border:2px dotted #FCE900;transition:transform .4s ease,box-shadow .4s ease;position:relative}
.teamShowcaseSection .personCardBox:hover{transform:scale(1.04);box-shadow:0 16px 40px #5d75d333}
.teamShowcaseSection .personCardBox .portraitImageBox{width:140px;height:140px;border-radius:50%;overflow:hidden;margin:0 auto 24px;border:4px solid #5D75D3;box-shadow:0 6px 16px #5d75d333}
.teamShowcaseSection .personCardBox .portraitImageBox img{width:100%;height:100%;object-fit:cover;display:block}
.teamShowcaseSection .personCardBox h3{font-size:26px;font-weight:700;line-height:1.3;color:#1a1a1a;margin:0 0 8px}
.teamShowcaseSection .personCardBox .roleLabel{font-size:15px;line-height:1.4;color:#5D75D3;font-weight:600;margin:0 0 16px;text-transform:uppercase;letter-spacing:.5px}
.teamShowcaseSection .personCardBox .bioText{font-size:16px;line-height:1.7;color:#4a4a4a;margin:0}
@media (max-width: 1024px) {
.aboutTitleSection .titleWrapperBox{grid-template-columns:1fr}
.aboutTitleSection .textContentBox{grid-column:1 / -1}
.aboutTitleSection .imageMosaicBox{grid-column:1 / -1}
.aboutTitleSection .mainTitleText{font-size:44px}
.storyContentSection .narrativeGridBox{grid-template-columns:1fr;gap:48px}
.storyContentSection .sideImageColumn{position:static}
.approachDetailsSection .cardsLayoutGrid{grid-template-columns:1fr}
}
@media (max-width: 768px) {
.aboutTitleSection{padding:60px 16px 40px}
.aboutTitleSection .mainTitleText{font-size:36px}
.aboutTitleSection .subtitleDescription{font-size:16px}
.aboutTitleSection .textContentBox{padding:28px}
.aboutTitleSection .imageMosaicBox{min-height:300px;gap:12px}
.storyContentSection{padding:60px 16px}
.storyContentSection .textFlowColumn h2{font-size:32px}
.approachDetailsSection{padding:60px 16px}
.approachDetailsSection .sectionHeaderBox h2{font-size:36px}
.teamShowcaseSection{padding:60px 16px}
.teamShowcaseSection .introHeaderBlock h2{font-size:34px}
.teamShowcaseSection .profilesFlexContainer{gap:32px}
}
.heroContactBox{position:relative;min-height:520px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#F6F7F8 0%,#fff 100%);overflow:hidden}
.heroContactBox::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background-image:url(./images/team_0015.jpg);background-size:cover;background-position:center;opacity:.12;z-index:1}
.heroContactBox::after{content:'';position:absolute;top:20px;right:20px;width:80px;height:80px;background:repeating-linear-gradient(45deg,#5D75D3,#5D75D3 2px,transparent 2px,transparent 8px);opacity:.15;border-radius:50%;z-index:2}
.heroContentInner{position:relative;z-index:3;max-width:720px;text-align:center;padding:48px 24px}
.heroContactBox h1{font-size:3rem;line-height:1.15;color:#1a1a1a;margin:0 0 24px;font-weight:700}
.heroLeadText{font-size:1.25rem;line-height:1.6;color:#333;margin:0 0 16px}
.heroSupportText{font-size:1.05rem;line-height:1.7;color:#555;margin:0}
.contactMainSection{max-width:1366px;margin:0 auto;padding:80px 24px;background:#fff}
.contactGridLayout{display:grid;grid-template-columns:1fr 1.2fr;gap:64px;align-items:start}
.contactInfoColumn h2{font-size:2rem;line-height:1.3;color:#1a1a1a;margin:0 0 32px;font-weight:600;position:relative;padding-left:16px}
.contactInfoColumn h2::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#5D75D3 0%,#FCE900 100%);border-radius:2px}
.infoBlockSet{display:flex;flex-direction:column;gap:28px}
.singleInfoCard{background:#F6F7F8;padding:24px;border-radius:20px;border:1px dashed #e0e0e0;transition:all .3s ease}
.singleInfoCard:hover{background:#fff;border-color:#5D75D3;box-shadow:0 8px 24px #5d75d31f;transform:translateY(-2px)}
.infoCardLabel{font-size:.85rem;text-transform:uppercase;letter-spacing:1px;color:#888;margin:0 0 8px;font-weight:500}
.infoCardValue{font-size:1.15rem;color:#1a1a1a;margin:0;font-weight:500}
.infoCardValue a{color:#5D75D3;text-decoration:none;transition:color .2s ease}
.infoCardValue a:hover{color:#3d55b3}
.formColumnBox{background:linear-gradient(135deg,#F6F7F8 0%,#fff 100%);padding:48px;border-radius:28px;border-left:5px solid #5D75D3;box-shadow:0 12px 32px #0000000f}
.formHeaderText{font-size:1.5rem;line-height:1.4;color:#1a1a1a;margin:0 0 28px;font-weight:600}
.primaryContactForm{display:flex;flex-direction:column;gap:24px}
.inputFieldRow{display:flex;flex-direction:column;gap:8px}
.inputFieldRow label{font-size:.95rem;color:#333;font-weight:500}
.inputFieldRow input,.inputFieldRow select{padding:14px 18px;border:2px solid #e0e0e0;border-radius:16px;font-size:1rem;color:#1a1a1a;background:#fff;transition:all .25s ease;outline:none}
.inputFieldRow input:focus,.inputFieldRow select:focus{border-color:#5D75D3;box-shadow:0 0 0 4px #5d75d31a}
.inputFieldRow input::placeholder{color:#999}
.timePreferenceSet{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.timeOptionWrapper{position:relative}
.timeOptionWrapper input[type="radio"]{position:absolute;opacity:0;width:0;height:0}
.timeOptionWrapper label{display:block;padding:12px 16px;text-align:center;border:2px solid #e0e0e0;border-radius:14px;cursor:pointer;font-size:.9rem;color:#555;background:#fff;transition:all .2s ease;font-weight:500}
.timeOptionWrapper input[type="radio"]:checked + label{background:#5D75D3;color:#fff;border-color:#5D75D3;box-shadow:0 4px 12px #5d75d340}
.timeOptionWrapper label:hover{border-color:#5D75D3}
.privacyConsentRow{display:flex;align-items:start;gap:12px;margin-top:8px}
.privacyConsentRow input[type="checkbox"]{margin-top:4px;width:18px;height:18px;cursor:pointer;flex-shrink:0}
.privacyConsentRow label{font-size:.9rem;color:#555;line-height:1.5}
.privacyConsentRow label a{color:#5D75D3;text-decoration:none;font-weight:500;transition:color .2s ease}
.privacyConsentRow label a:hover{color:#3d55b3;text-decoration:underline}
.submitButtonRow{margin-top:8px}
.submitButtonRow button{width:100%;padding:16px 32px;background:linear-gradient(135deg,#5D75D3 0%,#3d55b3 100%);color:#fff;font-size:1.05rem;font-weight:600;border:none;border-radius:18px;cursor:pointer;transition:all .3s ease;box-shadow:0 8px 20px #5d75d34d}
.submitButtonRow button:hover{transform:translateY(-3px);box-shadow:0 12px 28px #5d75d366}
.submitButtonRow button:active{transform:translateY(-1px)}
@media (max-width: 1024px) {
.contactGridLayout{grid-template-columns:1fr;gap:48px}
.heroContactBox h1{font-size:2.5rem}
.formColumnBox{padding:36px}
}
@media (max-width: 768px) {
.heroContactBox{min-height:420px}
.heroContactBox h1{font-size:2rem}
.heroLeadText{font-size:1.1rem}
.heroSupportText{font-size:1rem}
.contactMainSection{padding:60px 20px}
.formColumnBox{padding:28px 24px;border-radius:24px}
.timePreferenceSet{grid-template-columns:1fr}
.contactInfoColumn h2{font-size:1.75rem}
}
.titleWrapper{background:linear-gradient(180deg,#5D75D3 0%,#5d75d300 100%);padding:80px 20px 120px;position:relative;overflow:hidden}
.titleWrapper::after{content:'';position:absolute;bottom:-1px;left:0;width:100%;height:80px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120'%3E%3Cpath fill='%23ffffff' d='M0,64 Q360,10 720,64 T1440,64 L1440,120 L0,120 Z'/%3E%3C/svg%3E") no-repeat bottom;background-size:cover}
.titleContentBox{max-width:1366px;margin:0 auto;display:flex;align-items:center;gap:60px}
.titleTextArea{flex:1}
.mainTitle{font-size:56px;font-weight:700;color:#fff;line-height:1.2;margin:0 0 24px}
.mainTitle span{display:inline-block;opacity:0;animation:wordReveal .6s forwards}
.mainTitle span:nth-child(1){animation-delay:.1s}
.mainTitle span:nth-child(2){animation-delay:.3s}
.mainTitle span:nth-child(3){animation-delay:.5s}
.mainTitle span:nth-child(4){animation-delay:.7s}
@keyframes wordReveal {
to{opacity:1;transform:translateY(0)}
from{opacity:0;transform:translateY(20px)}
}
.titleImageHolder{flex:0 0 400px;opacity:0;animation:imageFadeIn 1s .8s forwards}
@keyframes imageFadeIn {
to{opacity:1}
}
.titleImageHolder img{width:100%;height:320px;object-fit:cover;border-radius:24px;box-shadow:0 12px 32px #5d75d34d}
.programDetailsSection{padding:80px 20px;background:#F6F7F8}
.programDetailsContainer{max-width:1366px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr 1fr;gap:40px}
.programCard{background:#fff;padding:0;border-radius:20px;border-left:5px solid;overflow:hidden;transition:transform 0.3s,box-shadow .3s}
.programCard:nth-child(1){border-left-color:#5D75D3}
.programCard:nth-child(2){border-left-color:#FCE900}
.programCard:nth-child(3){border-left-color:#5D75D3}
.programCard:hover{transform:translateY(-8px);box-shadow:0 16px 40px #5d75d326}
.cardImageSection{width:100%;height:200px;overflow:hidden}
.cardImageSection img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.programCard:hover .cardImageSection img{transform:scale(1.08)}
.cardContentArea{padding:32px}
.cardLabel{font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:1px;margin:0 0 12px}
.programCard:nth-child(1) .cardLabel{color:#5D75D3}
.programCard:nth-child(2) .cardLabel{color:#000}
.programCard:nth-child(3) .cardLabel{color:#5D75D3}
.cardTitle{font-size:24px;font-weight:700;color:#1a1a1a;margin:0 0 16px;line-height:1.3}
.cardDescription{font-size:16px;color:#4a4a4a;line-height:1.6;margin:0}
.instructorShowcaseSection{padding:100px 20px;background:linear-gradient(135deg,#fff 0%,#F6F7F8 100%);position:relative}
.instructorShowcaseSection::before{content:'';position:absolute;top:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,#5D75D3 0%,#FCE900 50%,#5D75D3 100%)}
.instructorWrapper{max-width:1366px;margin:0 auto}
.sectionHeading{font-size:42px;font-weight:700;color:#1a1a1a;margin:0 0 60px;text-align:center;position:relative;display:inline-block;width:100%}
.sectionHeading::after{content:'';position:absolute;bottom:-16px;left:50%;transform:translateX(-50%);width:80px;height:4px;background:#5D75D3;border-radius:2px}
.instructorGrid{display:grid;grid-template-columns:280px 1fr;gap:80px;align-items:start}
.instructorProfileStack{display:flex;flex-direction:column;gap:24px}
.profileImageBox{width:100%;height:280px;border-radius:28px;overflow:hidden;border:4px solid #fff;box-shadow:0 8px 24px #5d75d333;transition:box-shadow .3s}
.profileImageBox:hover{box-shadow:0 12px 32px #5d75d34d}
.profileImageBox img{width:100%;height:100%;object-fit:cover}
.instructorContentBlock{display:flex;flex-direction:column;gap:32px}
.instructorBio{background:#fff;padding:40px;border-radius:24px;border-left:5px solid #FCE900;box-shadow:0 4px 16px #0000000f}
.bioTitle{font-size:28px;font-weight:700;color:#1a1a1a;margin:0 0 20px}
.bioText{font-size:17px;color:#4a4a4a;line-height:1.7;margin:0 0 16px}
.bioText:last-child{margin:0}
.expertiseList{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.expertiseItem{background:linear-gradient(135deg,#F6F7F8 0%,#fff 100%);padding:24px;border-radius:16px;border:2px dashed #5D75D3;transition:all .3s}
.expertiseItem:hover{border-style:solid;transform:translateX(8px);box-shadow:0 6px 20px #5d75d326}
.expertiseItemTitle{font-size:18px;font-weight:600;color:#5D75D3;margin:0 0 8px;display:flex;align-items:center;gap:8px}
.expertiseItemTitle::before{content:'';width:6px;height:6px;background:#FCE900;border-radius:50%;display:inline-block}
.expertiseItemText{font-size:15px;color:#4a4a4a;line-height:1.5;margin:0}
.scheduleSection{padding:80px 20px;background:#fff}
.scheduleContainer{max-width:1366px;margin:0 auto}
.scheduleTitle{font-size:38px;font-weight:700;color:#1a1a1a;margin:0 0 48px}
.scheduleTabsWrapper{position:relative}
.tabInputHidden{position:absolute;opacity:0;pointer-events:none}
.tabNavigationBar{display:flex;gap:12px;margin-bottom:40px;border-bottom:2px solid #F6F7F8}
.tabButton{padding:16px 32px;font-size:18px;font-weight:600;color:#4a4a4a;background:transparent;border:none;border-bottom:3px solid transparent;cursor:pointer;transition:all .2s;position:relative}
.tabButton:hover{color:#5D75D3}
#tabPeriod1:checked ~ .tabNavigationBar .tabButton[for="tabPeriod1"],#tabPeriod2:checked ~ .tabNavigationBar .tabButton[for="tabPeriod2"],#tabPeriod3:checked ~ .tabNavigationBar .tabButton[for="tabPeriod3"]{color:#5D75D3;border-bottom-color:#5D75D3}
.tabContentHolder{position:relative}
.tabPanel{display:none;animation:tabFadeIn .4s}
@keyframes tabFadeIn {
from{opacity:0;transform:translateY(10px)}
to{opacity:1;transform:translateY(0)}
}
#tabPeriod1:checked ~ .tabContentHolder .tabPanel:nth-of-type(1),#tabPeriod2:checked ~ .tabContentHolder .tabPanel:nth-of-type(2),#tabPeriod3:checked ~ .tabContentHolder .tabPanel:nth-of-type(3){display:block}
.scheduleItemsGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:24px}
.scheduleItem{background:linear-gradient(135deg,#F6F7F8 0%,#fff 100%);padding:28px;border-radius:20px;border-left:4px solid #5D75D3;box-shadow:0 2px 12px #0000000d;transition:all .3s}
.scheduleItem:hover{box-shadow:0 8px 24px #5d75d333;transform:translateY(-4px)}
.scheduleItemHeader{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.scheduleWeek{font-size:14px;font-weight:700;color:#5D75D3;text-transform:uppercase;letter-spacing:1px}
.scheduleDuration{font-size:13px;color:#666;background:#FCE900;padding:4px 12px;border-radius:12px;font-weight:600}
.scheduleItemTitle{font-size:20px;font-weight:700;color:#1a1a1a;margin:0 0 12px;line-height:1.3}
.scheduleItemDesc{font-size:15px;color:#4a4a4a;line-height:1.6;margin:0}
@media (max-width: 1024px) {
.titleContentBox{flex-direction:column}
.titleImageHolder{flex:0 0 auto;width:100%}
.mainTitle{font-size:42px}
.programDetailsContainer{grid-template-columns:1fr 1fr}
.instructorGrid{grid-template-columns:1fr;gap:40px}
.profileImageBox{max-width:320px;margin:0 auto}
.expertiseList{grid-template-columns:1fr}
}
@media (max-width: 768px) {
.titleWrapper{padding:60px 20px 100px}
.mainTitle{font-size:32px}
.titleImageHolder{flex:0 0 auto}
.titleImageHolder img{height:240px}
.programDetailsContainer{grid-template-columns:1fr}
.sectionHeading{font-size:32px}
.scheduleTitle{font-size:28px}
.tabNavigationBar{flex-direction:column}
.tabButton{text-align:left;border-bottom:none;border-left:3px solid transparent;padding-left:20px}
#tabPeriod1:checked ~ .tabNavigationBar .tabButton[for="tabPeriod1"],#tabPeriod2:checked ~ .tabNavigationBar .tabButton[for="tabPeriod2"],#tabPeriod3:checked ~ .tabNavigationBar .tabButton[for="tabPeriod3"]{border-bottom-color:transparent;border-left-color:#5D75D3}
.scheduleItemsGrid{grid-template-columns:1fr}
}
.titleContainer{max-width:1366px;margin:0 auto;padding:80px 20px 60px;display:flex;align-items:center;gap:60px}
.titleContainer .imageWrapper{position:relative;flex-shrink:0;width:380px;height:380px}
.titleContainer .imageWrapper img{width:100%;height:100%;object-fit:cover;border-radius:50%;position:relative;z-index:2;animation:colorWashSlow 8s ease-in-out infinite}
@keyframes colorWashSlow {
0%,100%{filter:hue-rotate(0deg) saturate(1)}
50%{filter:hue-rotate(15deg) saturate(1.2)}
}
.titleContainer .decorativeLayer{position:absolute;top:-12px;left:-12px;right:-12px;bottom:-12px;border-radius:50%;background:linear-gradient(135deg,#5D75D3,#FCE900);z-index:1;animation:pulseOpacitySlow 6s ease-in-out infinite}
@keyframes pulseOpacitySlow {
0%,100%{opacity:.15}
50%{opacity:.35}
}
.titleContainer .textContent h1{font-size:56px;line-height:1.2;margin:0 0 20px;color:#1a1a1a}
.titleContainer .textContent .gradientWord{background:linear-gradient(90deg,#5D75D3,#FCE900);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.titleContainer .textContent p{font-size:19px;line-height:1.6;color:#444;margin:0}
.partnershipIntroBox{max-width:1366px;margin:0 auto 80px;padding:0 20px}
.partnershipIntroBox .contentGrid{display:grid;grid-template-columns:1fr 1fr;gap:50px;background:linear-gradient(135deg,#F6F7F8 0%,#fff 100%);padding:60px;border-radius:28px;border-left:6px solid #5D75D3;box-shadow:0 8px 20px #5d75d314}
.partnershipIntroBox .textColumn h2{font-size:38px;line-height:1.3;margin:0 0 24px;color:#1a1a1a}
.partnershipIntroBox .textColumn p{font-size:17px;line-height:1.7;color:#333;margin:0 0 18px}
.partnershipIntroBox .textColumn p:last-child{margin-bottom:0}
.partnershipIntroBox .statsColumn{display:flex;flex-direction:column;justify-content:center;gap:28px}
.partnershipIntroBox .statItem{background:#fff;padding:24px 30px;border-radius:20px;border:2px dashed #5D75D3;transition:all 300ms ease}
.partnershipIntroBox .statItem:hover{transform:translateX(6px);border-color:#FCE900;box-shadow:0 6px 16px #fce90026}
.partnershipIntroBox .statNumber{font-size:44px;font-weight:700;color:#5D75D3;margin:0 0 8px;display:block}
.partnershipIntroBox .statLabel{font-size:16px;color:#555;margin:0}
.collaborationTypesWrapper{background:linear-gradient(180deg,#F6F7F8 0%,#fff 100%);padding:90px 20px;margin-bottom:80px}
.collaborationTypesWrapper .sectionInner{max-width:1366px;margin:0 auto}
.collaborationTypesWrapper h2{font-size:42px;text-align:center;margin:0 0 60px;color:#1a1a1a}
.collaborationTypesWrapper h2::after{content:'';display:block;width:80px;height:4px;background:linear-gradient(90deg,#5D75D3,#FCE900);margin:20px auto 0;border-radius:4px}
.collaborationTypesWrapper .typesGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.collaborationTypesWrapper .typeCard{background:#fff;padding:40px 32px;border-radius:24px;border-left:5px solid #FCE900;box-shadow:0 6px 18px #5d75d30f;position:relative;overflow:hidden;transition:all 400ms ease}
.collaborationTypesWrapper .typeCard::before{content:'';position:absolute;top:0;right:0;width:120px;height:120px;background:radial-gradient(circle,#fce9001a 0%,transparent 70%);border-radius:50%;transform:translate(40%,-40%)}
.collaborationTypesWrapper .typeCard:hover{transform:translateY(-8px);box-shadow:0 12px 28px #5d75d324;border-left-color:#5D75D3}
.collaborationTypesWrapper .typeIcon{width:56px;height:56px;background:linear-gradient(135deg,#5D75D3,#FCE900);border-radius:16px;display:flex;align-items:center;justify-content:center;margin-bottom:24px}
.collaborationTypesWrapper .typeIcon svg{width:28px;height:28px;fill:#fff}
.collaborationTypesWrapper .typeCard h3{font-size:24px;margin:0 0 16px;color:#1a1a1a}
.collaborationTypesWrapper .typeCard p{font-size:16px;line-height:1.6;color:#444;margin:0 0 14px}
.collaborationTypesWrapper .typeCard p:last-child{margin-bottom:0}
.collaborationTypesWrapper .benefitsList{list-style:none;padding:0;margin:20px 0 0}
.collaborationTypesWrapper .benefitsList li{font-size:15px;color:#555;padding-left:28px;position:relative;margin-bottom:10px}
.collaborationTypesWrapper .benefitsList li::before{content:'';position:absolute;left:0;top:6px;width:16px;height:16px;background:linear-gradient(135deg,#5D75D3,#FCE900);border-radius:50%}
.partnerTestimonialSection{max-width:1366px;margin:0 auto 90px;padding:0 20px}
.partnerTestimonialSection .testimonialLayout{display:flex;gap:50px;align-items:center;background:#fff;padding:50px;border-radius:32px;box-shadow:0 10px 24px #5d75d31a;border:2px solid #F6F7F8;position:relative}
.partnerTestimonialSection .testimonialLayout::before{content:'';position:absolute;top:-2px;left:50%;transform:translateX(-50%);width:200px;height:4px;background:linear-gradient(90deg,#5D75D3,#FCE900);border-radius:0 0 4px 4px}
.partnerTestimonialSection .profileBox{flex-shrink:0;text-align:center}
.partnerTestimonialSection .profileBox img{width:180px;height:180px;object-fit:cover;border-radius:24px;margin-bottom:20px;border:4px solid #F6F7F8;box-shadow:0 6px 16px #5d75d31f}
.partnerTestimonialSection .profileBox h4{font-size:20px;margin:0 0 8px;color:#1a1a1a}
.partnerTestimonialSection .profileBox .role{font-size:15px;color:#666;margin:0}
.partnerTestimonialSection .quoteContent{flex:1}
.partnerTestimonialSection .quoteContent svg{width:48px;height:48px;fill:#FCE900;margin-bottom:20px;opacity:.6}
.partnerTestimonialSection .quoteContent p{font-size:19px;line-height:1.7;color:#333;margin:0 0 18px;font-style:italic}
.partnerTestimonialSection .quoteContent p:last-of-type{margin-bottom:0;font-style:normal}
.partnerTestimonialSection .highlightPhrase{color:#5D75D3;font-weight:600}
@media (max-width: 1024px) {
.titleContainer{flex-direction:column;text-align:center;gap:40px;padding:60px 20px 50px}
.titleContainer .imageWrapper{width:300px;height:300px}
.titleContainer .textContent h1{font-size:44px}
.partnershipIntroBox .contentGrid{grid-template-columns:1fr;gap:40px;padding:50px 40px}
.collaborationTypesWrapper .typesGrid{grid-template-columns:1fr;gap:30px}
.partnerTestimonialSection .testimonialLayout{flex-direction:column;gap:35px;padding:40px 30px}
}
@media (max-width: 768px) {
.titleContainer .imageWrapper{width:240px;height:240px}
.titleContainer .textContent h1{font-size:36px}
.titleContainer .textContent p{font-size:17px}
.partnershipIntroBox .contentGrid{padding:40px 24px}
.partnershipIntroBox .textColumn h2{font-size:32px}
.partnershipIntroBox .statNumber{font-size:36px}
.collaborationTypesWrapper{padding:70px 20px}
.collaborationTypesWrapper h2{font-size:34px;margin-bottom:50px}
.collaborationTypesWrapper .typeCard{padding:32px 24px}
.partnerTestimonialSection .testimonialLayout{padding:32px 20px}
.partnerTestimonialSection .profileBox img{width:150px;height:150px}
.partnerTestimonialSection .quoteContent p{font-size:17px}
}
.techReqHeroBox{position:relative;width:100%;max-width:1366px;margin:0 auto 80px;min-height:520px;overflow:hidden;border-radius:28px}
.techReqHeroBox img{width:100%;height:100%;min-height:520px;object-fit:cover;display:block}
.techReqHeroBox::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#5d75d3b3 0%,#f6f7f84d 100%);z-index:1}
.heroContentOverlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;text-align:center;width:90%;max-width:700px}
.heroContentOverlay h1{font-size:56px;line-height:1.1;margin:0 0 32px;color:#F6F7F8;text-shadow:3px 3px 12px #5d75d3cc -1px -1px 8px #5d75d399}
.heroContentOverlay .actionLinkPrimary{display:inline-block;padding:16px 48px;background:#FCE900;color:#1a1a1a;text-decoration:none;border-radius:24px;font-size:18px;font-weight:600;transition:all 280ms ease;box-shadow:0 8px 20px #fce9004d}
.heroContentOverlay .actionLinkPrimary:hover{transform:translateY(-3px);box-shadow:0 12px 28px #fce90080;background:#ffe715}
.techReqHeroBox::after{content:'';position:absolute;bottom:20px;right:20px;width:80px;height:80px;border-right:3px solid #fce90099;border-bottom:3px solid #fce90099;z-index:3}
.requirementsGridSection{max-width:1366px;margin:0 auto 100px;padding:0 24px}
.requirementsGridSection h2{font-size:42px;line-height:1.2;margin:0 0 48px;color:#2a2a2a;position:relative;padding-left:24px}
.requirementsGridSection h2::before{content:'';position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(180deg,#5D75D3 0%,#FCE900 100%);border-radius:3px}
.requirementsGridBox{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.requirementCardItem{background:#F6F7F8;border-radius:20px;padding:32px 28px;border-left:5px solid #5D75D3;transition:all 320ms ease;position:relative;overflow:hidden}
.requirementCardItem::before{content:'';position:absolute;top:0;right:0;width:120px;height:120px;background:radial-gradient(circle,#5d75d314 0%,transparent 70%);border-radius:50%;transform:translate(40%,-40%);transition:transform 350ms ease}
.requirementCardItem:hover::before{transform:translate(30%,-30%)}
.requirementCardItem:hover{transform:translateY(-6px);box-shadow:0 14px 32px #5d75d326;border-left-color:#FCE900}
.requirementCardItem h3{font-size:22px;line-height:1.3;margin:0 0 16px;color:#2a2a2a;position:relative}
.requirementCardItem p{font-size:16px;line-height:1.6;margin:0;color:#4a4a4a}
.requirementCardItem .specList{list-style:none;padding:0;margin:16px 0 0}
.requirementCardItem .specList li{font-size:15px;line-height:1.5;color:#5a5a5a;padding:8px 0 8px 28px;position:relative}
.requirementCardItem .specList li::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:16px;height:16px;background:#5D75D3;border-radius:50%;opacity:.6}
.setupGuideSection{max-width:1366px;margin:0 auto 80px;padding:0 24px}
.setupGuideContainer{background:linear-gradient(135deg,#F6F7F8 0%,#fff 100%);border-radius:28px;padding:56px 48px;position:relative;overflow:hidden;border:2px dashed #5d75d333}
.setupGuideContainer::after{content:'';position:absolute;top:16px;left:16px;width:100px;height:100px;border-top:3px solid #fce90066;border-left:3px solid #fce90066;border-radius:20px 0 0 0}
.setupGuideContainer h2{font-size:38px;line-height:1.2;margin:0 0 36px;color:#2a2a2a;text-align:center}
.setupStepsWrapper{display:flex;flex-direction:column;gap:24px;max-width:900px;margin:0 auto;position:relative}
.setupStepsWrapper::before{content:'';position:absolute;left:32px;top:40px;bottom:40px;width:3px;background:linear-gradient(180deg,#5D75D3 0%,#FCE900 100%);opacity:.3}
.stepItemBox{display:flex;align-items:flex-start;gap:24px;background:#fff;padding:24px;border-radius:18px;border-left:4px solid #F6F7F8;transition:all 260ms ease;position:relative}
.stepItemBox:hover{border-left-color:#5D75D3;box-shadow:0 8px 24px #5d75d31f}
.stepNumberCircle{flex-shrink:0;width:64px;height:64px;background:linear-gradient(135deg,#5D75D3 0%,#7a8fd9 100%);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;color:#F6F7F8;box-shadow:0 6px 16px #5d75d340}
.stepContentText h3{font-size:20px;line-height:1.3;margin:0 0 12px;color:#2a2a2a}
.stepContentText p{font-size:16px;line-height:1.6;margin:0;color:#4a4a4a}
@media (max-width: 1024px) {
.techReqHeroBox{min-height:440px;margin-bottom:64px}
.techReqHeroBox img{min-height:440px}
.heroContentOverlay h1{font-size:44px;margin-bottom:24px}
.requirementsGridBox{grid-template-columns:repeat(2,1fr);gap:24px}
.setupGuideContainer{padding:44px 36px}
.setupStepsWrapper::before{display:none}
}
@media (max-width: 768px) {
.techReqHeroBox{min-height:380px;margin-bottom:48px;border-radius:20px}
.techReqHeroBox img{min-height:380px}
.heroContentOverlay h1{font-size:34px;margin-bottom:20px}
.heroContentOverlay .actionLinkPrimary{padding:14px 36px;font-size:16px}
.techReqHeroBox::after{width:60px;height:60px;bottom:12px;right:12px}
.requirementsGridSection{margin-bottom:64px;padding:0 20px}
.requirementsGridSection h2{font-size:32px;margin-bottom:32px}
.requirementsGridBox{grid-template-columns:1fr;gap:20px}
.requirementCardItem{padding:28px 24px}
.setupGuideSection{margin-bottom:64px;padding:0 20px}
.setupGuideContainer{padding:36px 24px;border-radius:20px}
.setupGuideContainer h2{font-size:28px;margin-bottom:28px}
.stepItemBox{flex-direction:column;gap:16px}
.stepNumberCircle{width:56px;height:56px;font-size:20px}
}
.successPageWrap{min-height:80vh;display:flex;align-items:center;justify-content:center;padding:3rem 1rem;background:linear-gradient(135deg,#F6F7F8 0%,#fff 50%,#F6F7F8 100%);background-size:200% 200%;animation:gradientDrift 8s ease infinite;position:relative;overflow:hidden}
@keyframes gradientDrift {
0%{background-position:0 50%}
50%{background-position:100% 50%}
100%{background-position:0 50%}
}
.successPageWrap::before{content:'';position:absolute;top:0;left:0;width:80px;height:80px;border-top:2px solid #5D75D3;border-left:2px solid #5D75D3;opacity:.3}
.successPageWrap::after{content:'';position:absolute;bottom:0;right:0;width:100px;height:100px;border-bottom:2px solid #FCE900;border-right:2px solid #FCE900;opacity:.3}
.confirmationBox{max-width:680px;width:100%;margin:0 auto;background:#fff;border-radius:24px;padding:3.5rem 2rem;box-shadow:0 8px 24px #5d75d31f;text-align:center;position:relative;z-index:1}
.confirmationBox .checkmarkCircle{width:96px;height:96px;margin:0 auto 2rem;position:relative}
.confirmationBox .checkmarkCircle svg{width:100%;height:100%;display:block}
.confirmationBox .checkmarkCircle circle{stroke:#5D75D3;stroke-width:3;fill:none;stroke-dasharray:302;stroke-dashoffset:302;animation:fillCircle 1s ease forwards}
.confirmationBox .checkmarkCircle path{stroke:#5D75D3;stroke-width:3;fill:none;stroke-dasharray:80;stroke-dashoffset:80;animation:drawCheck .6s ease forwards .8s;stroke-linecap:round;stroke-linejoin:round}
@keyframes fillCircle {
to{stroke-dashoffset:0}
}
@keyframes drawCheck {
to{stroke-dashoffset:0}
}
.confirmationBox .primaryHeadline{font-size:2rem;line-height:1.2;color:#2a2a2a;margin:0 0 .75rem;font-weight:700}
.confirmationBox .secondaryMessage{font-size:1.125rem;line-height:1.6;color:#555;margin:0 0 2.5rem;max-width:520px;margin-left:auto;margin-right:auto}
.confirmationBox .detailsPanel{background:linear-gradient(135deg,#F6F7F8 0%,#fff 100%);border-radius:16px;padding:1.75rem 1.5rem;margin:0 0 2rem;border-left:4px solid #5D75D3}
.confirmationBox .detailsPanel .infoRow{display:flex;flex-direction:column;gap:.5rem;text-align:left;padding:.875rem 0;border-bottom:1px dashed #d0d0d0}
.confirmationBox .detailsPanel .infoRow:last-child{border-bottom:none;padding-bottom:0}
.confirmationBox .detailsPanel .infoRow:first-child{padding-top:0}
.confirmationBox .detailsPanel .labelText{font-size:.875rem;color:#777;text-transform:uppercase;letter-spacing:.5px;font-weight:600}
.confirmationBox .detailsPanel .valueText{font-size:1.0625rem;color:#2a2a2a;font-weight:500}
.confirmationBox .actionButtonsRow{display:flex;flex-direction:column;gap:1rem;margin-top:2rem}
.confirmationBox .actionButtonsRow .primaryActionBtn{background:linear-gradient(135deg,#5D75D3 0%,#4a5fb8 100%);color:#fff;text-decoration:none;padding:1rem 2.5rem;border-radius:20px;font-size:1.0625rem;font-weight:600;display:inline-block;transition:all .3s ease;box-shadow:0 6px 16px #5d75d340}
.confirmationBox .actionButtonsRow .primaryActionBtn:hover{transform:translateY(-2px);box-shadow:0 10px 24px #5d75d359}
.confirmationBox .actionButtonsRow .secondaryActionBtn{background:transparent;color:#5D75D3;text-decoration:none;padding:1rem 2.5rem;border-radius:20px;font-size:1.0625rem;font-weight:600;display:inline-block;transition:all .3s ease;border:2px solid #5D75D3}
.confirmationBox .actionButtonsRow .secondaryActionBtn:hover{background:#5D75D3;color:#fff;transform:translateY(-1px)}
.confirmationBox .supportNote{font-size:.9375rem;line-height:1.5;color:#666;margin-top:2rem;padding-top:2rem;border-top:1px solid #e5e5e5}
.confirmationBox .supportNote a{color:#5D75D3;text-decoration:none;font-weight:600;transition:color .2s ease}
.confirmationBox .supportNote a:hover{color:#4a5fb8;text-decoration:underline}
@media (min-width: 768px) {
.successPageWrap{padding:4rem 2rem}
.confirmationBox{padding:4rem 3rem}
.confirmationBox .primaryHeadline{font-size:2.5rem}
.confirmationBox .secondaryMessage{font-size:1.25rem}
.confirmationBox .actionButtonsRow{flex-direction:row;justify-content:center}
.confirmationBox .detailsPanel .infoRow{flex-direction:row;justify-content:space-between;align-items:center}
.confirmationBox .detailsPanel .infoRow .valueText{text-align:right}
}