@import "https://cdn.jsdelivr.net/npm/@fontsource/dm-sans@latest/300.css";
@import "https://cdn.jsdelivr.net/npm/@fontsource/dm-sans@latest/400.css";
@import "https://cdn.jsdelivr.net/npm/@fontsource/dm-sans@latest/500.css";
@import "https://cdn.jsdelivr.net/npm/@fontsource/dm-sans@latest/700.css";
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'DM Sans',sans-serif;background:#fefefe;color:#1a1a1a;line-height:1.6;font-size:16px}
.siteHeader{background:#ffffffbf;backdrop-filter:blur(12px);border-bottom:1px solid #8d43f81a;box-shadow:0 8px 32px #8d43f80f}
.topUtility{background:linear-gradient(135deg,#8D43F8 0%,#124735 100%);padding:8px 0;text-align:center;font-size:13px;color:#fff}
.topUtility .contentWrap{max-width:1000px;margin:0 auto;padding:0 20px}
.logoRow{padding:22px 0;border-bottom:1px solid #8d43f814}
.logoRow .contentWrap{max-width:1000px;margin:0 auto;padding:0 20px;display:flex;justify-content:center;align-items:center}
.brandLogo{display:flex;align-items:center;gap:14px;text-decoration:none;color:#1a1a1a}
.brandLogo img{height:110px;width:110px;object-fit:contain;background:#8d43f80a;border-radius:8px;padding:10px;box-shadow:0 4px 16px #8d43f81f}
.brandLogo .companyName{font-size:32px;font-weight:700;color:#124735}
.navRow{padding:0}
.navRow .contentWrap{max-width:1000px;margin:0 auto;padding:0 20px}
.mainNav{display:flex;justify-content:center;gap:8px;list-style:none;padding:16px 0;flex-wrap:wrap}
.mainNav li a{display:block;padding:10px 24px;text-decoration:none;color:#1a1a1a;font-weight:500;font-size:15px;border-radius:6px;transition:background 0.2s,color .2s}
.mainNav li a:hover{background:#8d43f814;color:#8D43F8}
.siteFooter{background:#124735;color:#fff;margin-top:80px}
.footerTop{padding:50px 0 30px;border-bottom:1px solid #ffffff26}
.footerTop .contentWrap{max-width:1000px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:40px}
.footerBlock h3{font-size:18px;font-weight:700;margin-bottom:18px;color:#FFF3D3}
.footerBlock p,.footerBlock address{font-style:normal;font-size:14px;line-height:1.7;color:#ffffffd9;margin-bottom:10px}
.footerBlock a{color:#ffffffd9;text-decoration:none;transition:color .2s}
.footerBlock a:hover{color:#FFF3D3}
.footerNav{list-style:none}
.footerNav li{margin-bottom:10px}
.footerNav li a{display:inline-block;padding:4px 0}
.disclaimerSection{background:#0003;padding:24px 0;margin-top:20px}
.disclaimerSection .contentWrap{max-width:1000px;margin:0 auto;padding:0 20px}
.disclaimerSection h4{font-size:16px;font-weight:600;margin-bottom:12px;color:#FFF3D3}
.disclaimerSection p{font-size:13px;line-height:1.7;color:#ffffffbf}
.footerBottom{padding:20px 0;text-align:center;font-size:13px;color:#ffffffb3}
.footerBottom .contentWrap{max-width:1000px;margin:0 auto;padding:0 20px}
.ageVerifyOverlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000d9;z-index:9999;display:flex;align-items:center;justify-content:center}
.ageVerifyBox{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#fff;border-radius:10px;padding:30px;max-width:420px;width:90vw;box-shadow:0 16px 48px #0000004d;z-index:10000;text-align:center}
.ageVerifyBox h2{font-size:24px;font-weight:700;color:#124735;margin-bottom:16px}
.ageVerifyBox p{font-size:15px;line-height:1.6;color:#444;margin-bottom:24px}
.ageVerifyActions{display:flex;gap:12px;justify-content:center}
.ageVerifyActions button{padding:14px 28px;font-size:15px;font-weight:600;font-family:'DM Sans',sans-serif;border:none;cursor:pointer;transition:background 0.2s,transform .1s;min-height:48px}
.btnConfirmAge{background:#124735;color:#fff}
.btnConfirmAge:hover{background:#0d3426;transform:translateY(-1px)}
.btnDenyAge{background:#e8e8e8;color:#333}
.btnDenyAge:hover{background:#d4d4d4}
.ageMessage{display:none;margin-top:20px;padding:16px;background:#FFF3D3;border-radius:6px;font-size:14px;color:#124735}
.cookieConsentModal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#fff;border-radius:8px;padding:28px;max-width:480px;width:90vw;box-shadow:0 12px 40px #0003;z-index:9998;animation:slideInFromLeft .4s ease-out}
@keyframes slideInFromLeft {
from{transform:translate(-120%,-50%);opacity:0}
to{transform:translate(-50%,-50%);opacity:1}
}
.cookieConsentModal.slideOut{animation:slideOutToLeft .4s ease-in forwards}
@keyframes slideOutToLeft {
to{transform:translate(-120%,-50%);opacity:0}
}
.cookieOverlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#00000080;z-index:9997}
.cookieConsentModal h3{font-size:20px;font-weight:700;color:#124735;margin-bottom:14px}
.cookieConsentModal p{font-size:14px;line-height:1.6;color:#444;margin-bottom:20px}
.cookieToggleGroup{margin-bottom:20px}
.cookieToggleItem{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid #e8e8e8}
.cookieToggleItem label{font-size:14px;color:#333;font-weight:500}
.cookieToggleItem input[type="checkbox"]{width:18px;height:18px;cursor:pointer}
.cookieActions{display:flex;gap:10px;margin-top:24px}
.cookieActions button{flex:1;padding:12px;font-size:14px;font-weight:600;font-family:'DM Sans',sans-serif;border:none;cursor:pointer;transition:background .2s}
.btnAcceptCookies{background:#124735;color:#fff}
.btnAcceptCookies:hover{background:#0d3426}
.btnDeclineCookies{background:#e8e8e8;color:#333}
.btnDeclineCookies:hover{background:#d4d4d4}
.btnPolicyInfo{background:#8D43F8;color:#fff}
.btnPolicyInfo:hover{background:#7435d1}
.prefsAccessLink{position:fixed;bottom:20px;right:20px;background:#124735;color:#fff;padding:12px 18px;border-radius:6px;text-decoration:none;font-size:13px;font-weight:600;box-shadow:0 4px 16px #1247354d;display:flex;align-items:center;gap:8px;z-index:1000;transition:background .2s}
.prefsAccessLink:hover{background:#0d3426}
@media (max-width: 768px) {
.brandLogo .companyName{font-size:24px}
.brandLogo img{height:80px;width:80px}
.mainNav{flex-direction:column;align-items:stretch}
.mainNav li a{text-align:center;padding:12px 20px}
.footerTop .contentWrap{grid-template-columns:1fr;gap:30px}
.ageVerifyBox{padding:24px}
.ageVerifyActions{flex-direction:column}
.cookieConsentModal{padding:22px}
.cookieActions{flex-direction:column}
}
.rules-section{max-width:1000px;margin:0 auto;padding:60px 20px;background:#fff}
.rules-section h1{font-size:42px;font-weight:700;color:#1a1a1a;margin:0 0 16px;line-height:1.2;letter-spacing:-.5px}
.rules-section h2{font-size:32px;font-weight:600;color:#2a2a2a;margin:48px 0 20px;line-height:1.3;letter-spacing:-.3px}
.rules-section h3{font-size:24px;font-weight:600;color:#333;margin:36px 0 16px;line-height:1.4}
.rules-section h4{font-size:20px;font-weight:600;color:#444;margin:28px 0 14px;line-height:1.4}
.rules-section h5{font-size:18px;font-weight:600;color:#555;margin:24px 0 12px;line-height:1.5}
.rules-section h6{font-size:16px;font-weight:600;color:#666;margin:20px 0 10px;line-height:1.5;text-transform:uppercase;letter-spacing:.5px}
.rules-section p{font-size:16px;font-weight:400;color:#3a3a3a;line-height:1.75;margin:0 0 20px}
.rules-section strong,.rules-section b{font-weight:600;color:#1a1a1a}
.rules-section ul,.rules-section ol{margin:0 0 24px;padding-left:28px}
.rules-section li{font-size:16px;color:#3a3a3a;line-height:1.75;margin-bottom:12px}
.rules-section table{width:100%;border-collapse:collapse;margin:32px 0;background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 2px 16px #8d43f814}
.rules-section thead{background:linear-gradient(135deg,#f8f8f8 0%,#fafafa 100%)}
.rules-section thead tr{border-bottom:2px solid #e8e8e8}
.rules-section th{padding:18px 20px;text-align:left;font-size:15px;font-weight:600;color:#2a2a2a;letter-spacing:.3px}
.rules-section tbody tr{border-bottom:1px solid #f2f2f2;transition:background .2s ease}
.rules-section tbody tr:last-child{border-bottom:none}
.rules-section tbody tr:hover{background:#fafafa}
.rules-section td{padding:16px 20px;font-size:15px;color:#3a3a3a;line-height:1.6}
.rules-section hr{border:none;height:1px;background:linear-gradient(90deg,transparent 0%,#e0e0e0 50%,transparent 100%);margin:48px 0}
@media (max-width: 768px) {
.rules-section{padding:40px 16px}
.rules-section h1{font-size:32px;margin-bottom:12px}
.rules-section h2{font-size:26px;margin:36px 0 16px}
.rules-section h3{font-size:22px;margin:28px 0 14px}
.rules-section h4{font-size:19px;margin:24px 0 12px}
.rules-section h5{font-size:17px;margin:20px 0 10px}
.rules-section h6{font-size:15px;margin:18px 0 10px}
.rules-section p{font-size:15px;margin-bottom:18px}
.rules-section li{font-size:15px;margin-bottom:10px}
.rules-section table{font-size:14px;margin:24px 0;display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
.rules-section th,.rules-section td{padding:14px 16px;font-size:14px}
.rules-section hr{margin:36px 0}
}
@media (max-width: 480px) {
.rules-section{padding:32px 12px}
.rules-section h1{font-size:28px}
.rules-section h2{font-size:24px}
.rules-section h3{font-size:20px}
.rules-section th,.rules-section td{padding:12px 14px}
}
.heroArea{position:relative;max-width:1000px;margin:0 auto;padding:60px 20px;overflow:hidden}
.heroArea .shapeBackground{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1}
.heroArea .shapeBackground svg{position:absolute;opacity:.12}
.heroArea .shapeBackground svg:nth-child(1){top:10%;left:5%;width:180px;height:180px;fill:#8D43F8}
.heroArea .shapeBackground svg:nth-child(2){bottom:15%;right:8%;width:220px;height:220px;fill:#124735}
.heroArea .shapeBackground svg:nth-child(3){top:40%;right:20%;width:140px;height:140px;fill:#FFF3D3}
.heroArea .contentGrid{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.heroArea .textContent h1{font-size:2.8rem;line-height:1.2;margin:0 0 24px;color:#1a1a1a;font-weight:700}
.heroArea .textContent h1 .highlight{position:relative;display:inline-block}
.heroArea .textContent h1 .highlight::after{content:'';position:absolute;bottom:4px;left:0;right:0;height:12px;background:linear-gradient(90deg,#8D43F8 0%,#8d43f84d 100%);z-index:-1}
.heroArea .textContent p{font-size:1.1rem;line-height:1.7;color:#333;margin:0 0 32px}
.heroArea .visualElement{position:relative}
.heroArea .visualElement img{width:100%;height:420px;object-fit:cover;clip-path:polygon(20% 0%,100% 0%,100% 80%,80% 100%,0% 100%,0% 20%);box-shadow:0 18px 48px #8d43f833}
.heroArea .ctaButton{display:inline-block;padding:16px 36px;background:linear-gradient(135deg,#8D43F8 0%,#6a2fc4 100%);color:#fff;text-decoration:none;border-radius:8px;font-weight:600;font-size:1.05rem;box-shadow:0 8px 24px #8d43f84d;transition:all .3s ease}
.heroArea .ctaButton:hover{transform:translateY(-2px);box-shadow:0 12px 32px #8d43f866}
.heroArea .ctaButton:active{transform:translateY(0)}
.statsSection{background:linear-gradient(135deg,#f8f9fa 0%,#fff 100%);padding:70px 20px;margin:80px 0}
.statsSection .containerWrap{max-width:1000px;margin:0 auto}
.statsSection .sectionLabel{text-align:center;margin:0 0 50px}
.statsSection .sectionLabel h2{font-size:2.2rem;color:#1a1a1a;margin:0 0 16px;font-weight:700}
.statsSection .sectionLabel p{font-size:1.1rem;color:#555;margin:0}
.statsSection .metricsDisplay{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.statsSection .metricCard{background:#fff;padding:40px 30px;border-radius:10px;text-align:center;box-shadow:0 12px 36px #0000000f;transition:all .3s ease;position:relative}
.statsSection .metricCard::before{content:'';position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,#8D43F8 0%,#124735 100%);border-radius:10px 10px 0 0;opacity:0;transition:opacity .3s ease}
.statsSection .metricCard:hover::before{opacity:1}
.statsSection .metricCard:hover{transform:translateY(-6px);box-shadow:0 16px 48px #0000001a}
.statsSection .metricCard .numberValue{font-size:3.2rem;font-weight:700;color:#8D43F8;margin:0 0 12px;line-height:1}
.statsSection .metricCard .metricTitle{font-size:1.15rem;color:#1a1a1a;font-weight:600;margin:0 0 8px}
.statsSection .metricCard .metricDesc{font-size:.95rem;color:#666;margin:0;line-height:1.5}
.skillsPanel{max-width:1000px;margin:0 auto;padding:70px 20px}
.skillsPanel .panelIntro{text-align:center;margin:0 0 60px}
.skillsPanel .panelIntro h2{font-size:2.2rem;color:#1a1a1a;margin:0 0 18px;font-weight:700;position:relative;display:inline-block}
.skillsPanel .panelIntro h2::before{content:'';position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);width:80px;height:4px;background:#8D43F8;border-radius:2px}
.skillsPanel .panelIntro p{font-size:1.1rem;color:#555;margin:24px 0 0;max-width:700px;margin-left:auto;margin-right:auto}
.skillsPanel .skillsLayout{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}
.skillsPanel .skillItem{background:#fff;padding:35px;border-radius:8px;border:2px solid #f0f0f0;transition:all .3s ease;display:flex;gap:20px}
.skillsPanel .skillItem:hover{border-color:#8D43F8;box-shadow:0 10px 32px #8d43f826}
.skillsPanel .skillItem .iconWrapper{flex-shrink:0;width:60px;height:60px;background:linear-gradient(135deg,#8D43F8 0%,#6a2fc4 100%);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.8rem}
.skillsPanel .skillItem .skillContent h3{font-size:1.3rem;color:#1a1a1a;margin:0 0 10px;font-weight:600}
.skillsPanel .skillItem .skillContent p{font-size:.98rem;color:#666;margin:0;line-height:1.6}
.skillsPanel .skillItem img{width:100%;height:240px;object-fit:cover;border-radius:6px;margin:16px 0 0}
@media (max-width: 768px) {
.heroArea .contentGrid{grid-template-columns:1fr;gap:40px}
.heroArea .textContent h1{font-size:2.2rem}
.heroArea .visualElement img{height:320px}
.statsSection .metricsDisplay{grid-template-columns:1fr;gap:30px}
.skillsPanel .skillsLayout{grid-template-columns:1fr}
}
@media (min-width: 769px) and (max-width: 1024px) {
.heroArea .contentGrid{gap:35px}
.statsSection .metricsDisplay{grid-template-columns:repeat(3,1fr);gap:30px}
}
.contactHero-wrapper{position:relative;overflow:hidden;background:linear-gradient(135deg,#f8f9fa 0%,#e9ecef 100%);padding:80px 20px;margin-bottom:60px}
.contactHero-wrapper::before{content:'';position:absolute;top:-50%;right:-10%;width:60%;height:200%;background:linear-gradient(45deg,#8d43f814,transparent);transform:rotate(-15deg);animation:bgShift 8s ease-in-out infinite alternate}
@keyframes bgShift {
0%{transform:rotate(-15deg) translateX(0)}
100%{transform:rotate(-15deg) translateX(20px)}
}
.contactHero-container{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;position:relative;z-index:2}
.contactHero-textBlock{padding-right:20px}
.contactHero-textBlock h1{font-size:2.8rem;line-height:1.2;margin-bottom:30px;color:#2c3e50;font-weight:700}
.contactHero-bulletList{list-style:none;padding:0;margin:0}
.contactHero-bulletList li{padding:12px 0 12px 30px;position:relative;color:#495057;font-size:1.1rem;line-height:1.6}
.contactHero-bulletList li::before{content:'';position:absolute;left:0;top:18px;width:12px;height:12px;background:#8D43F8;border-radius:50%;box-shadow:0 2px 8px #8d43f866}
.contactHero-imageBlock{position:relative;height:320px}
.contactHero-visualEffect{position:absolute;width:100%;height:100%;background:linear-gradient(135deg,#8D43F8 0%,#124735 50%,#FFF3D3 100%);border-radius:8px;transform:rotate(3deg);box-shadow:0 15px 40px #8d43f840}
.contactHero-visualEffect::after{content:'';position:absolute;top:10px;left:10px;right:-10px;bottom:-10px;background:linear-gradient(225deg,#124735b3,#fff3d399);border-radius:8px;mix-blend-mode:overlay}
.contactMain-wrapper{max-width:1000px;margin:0 auto;padding:0 20px 80px}
.contactForm-container{background:#fff;border-radius:10px;padding:50px;box-shadow:0 10px 35px #8d43f81f}
.formLayout-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-bottom:30px}
.formField-block{display:flex;flex-direction:column}
.formField-block label{font-size:.95rem;font-weight:600;color:#2c3e50;margin-bottom:8px}
.formField-block input[type="text"],.formField-block input[type="tel"],.formField-block select{padding:14px 16px;border:2px solid #dee2e6;border-radius:6px;font-size:1rem;transition:all .3s ease;background:#f8f9fa}
.formField-block input[type="text"]:focus,.formField-block input[type="tel"]:focus,.formField-block select:focus{outline:none;border-color:#8D43F8;background:#fff;box-shadow:0 4px 12px #8d43f826}
.formField-block select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%232c3e50' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px;cursor:pointer}
.radioGroup-wrapper{grid-column:1 / -1;margin-top:10px}
.radioGroup-wrapper legend{font-size:.95rem;font-weight:600;color:#2c3e50;margin-bottom:15px}
.radioOptions-flex{display:flex;gap:25px;flex-wrap:wrap}
.radioOptions-flex label{display:flex;align-items:center;cursor:pointer;font-size:1rem;color:#495057}
.radioOptions-flex input[type="radio"]{margin-right:8px;width:18px;height:18px;cursor:pointer;accent-color:#8D43F8}
.privacyCheck-wrapper{margin:30px 0;display:flex;align-items:flex-start}
.privacyCheck-wrapper input[type="checkbox"]{margin-right:10px;margin-top:4px;width:18px;height:18px;cursor:pointer;flex-shrink:0;accent-color:#8D43F8}
.privacyCheck-wrapper label{font-size:.9rem;color:#6c757d;line-height:1.5;cursor:pointer}
.privacyCheck-wrapper a{color:#8D43F8;text-decoration:none;font-weight:600}
.privacyCheck-wrapper a:hover{text-decoration:underline}
.submitBtn-wrapper{text-align:center}
.submitBtn-action{background:linear-gradient(135deg,#8D43F8 0%,#6a2fc7 100%);color:#fff;border:none;padding:16px 60px;font-size:1.1rem;font-weight:600;border-radius:8px;cursor:pointer;transition:all .3s ease;box-shadow:0 8px 20px #8d43f84d;position:relative;z-index:10}
.submitBtn-action:hover{transform:translateY(-2px);box-shadow:0 12px 28px #8d43f866}
.submitBtn-action:active{transform:translateY(0);box-shadow:0 6px 16px #8d43f84d}
.contactInfo-sidebar{margin-top:50px;padding:40px;background:linear-gradient(135deg,#FFF3D3 0%,#f8f1d8 100%);border-radius:10px;border-left:5px solid #124735}
.contactInfo-sidebar h2{font-size:1.6rem;color:#124735;margin-bottom:25px;font-weight:700}
.contactDetail-item{display:flex;align-items:flex-start;margin-bottom:20px}
.contactDetail-item i{font-size:1.3rem;color:#8D43F8;margin-right:15px;margin-top:2px}
.contactDetail-content{flex:1}
.contactDetail-content strong{display:block;font-size:.9rem;color:#495057;margin-bottom:4px;font-weight:600}
.contactDetail-content span,.contactDetail-content a{color:#2c3e50;font-size:1rem;text-decoration:none}
.contactDetail-content a:hover{color:#8D43F8}
@media (max-width: 768px) {
.contactHero-container{grid-template-columns:1fr;gap:40px}
.contactHero-wrapper{padding:60px 20px}
.contactHero-textBlock h1{font-size:2.2rem}
.contactHero-imageBlock{height:240px}
.formLayout-grid{grid-template-columns:1fr;gap:20px}
.contactForm-container{padding:30px 20px}
.radioGroup-wrapper{grid-column:1}
.submitBtn-action{width:100%;padding:16px 30px}
.contactInfo-sidebar{padding:30px 20px}
}
@media (max-width: 480px) {
.contactHero-textBlock h1{font-size:1.8rem}
.contactHero-bulletList li{font-size:1rem}
.radioOptions-flex{flex-direction:column;gap:15px}
}
.heroWrap{position:relative;overflow:hidden;background:linear-gradient(135deg,#f8f9fa 0%,#f8f9fa 50%,#fff 50%,#fff 100%);padding:80px 20px;margin-bottom:60px}
.heroWrap::before{content:'';position:absolute;width:400px;height:400px;border-radius:50%;background:#8d43f814;top:-100px;right:-100px;z-index:1}
.heroWrap::after{content:'';position:absolute;width:300px;height:300px;border-radius:50%;background:#1247350d;bottom:-80px;left:-80px;z-index:1}
.heroContent{max-width:1000px;margin:0 auto;position:relative;z-index:2}
.heroContent h1{font-size:3.2em;margin:0 0 20px;color:#1a1a1a;line-height:1.1}
.heroContent .tagline{font-size:1.3em;color:#4a4a4a;max-width:680px;line-height:1.6}
.demoSection{max-width:1000px;margin:0 auto 80px;padding:0 20px}
.demoContainer{background:linear-gradient(145deg,#fff 0%,#f8f9fa 100%);border-radius:12px;padding:40px;box-shadow:0 8px 28px #8d43f826;position:relative}
.demoContainer h2{font-size:2em;margin:0 0 16px;color:#1a1a1a}
.demoContainer .intro{font-size:1.1em;color:#4a4a4a;margin-bottom:30px;line-height:1.6}
.demoFrame{position:relative;width:100%;padding-bottom:75%;background:linear-gradient(135deg,#8D43F8 0%,#124735 100%);border-radius:8px;overflow:hidden;margin-bottom:24px}
.demoFrame::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:#ffffff1a;backdrop-filter:blur(20px);z-index:1}
.tryDemoLink{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;background:#fff;color:#8D43F8;padding:18px 48px;border-radius:8px;text-decoration:none;font-size:1.2em;font-weight:600;box-shadow:0 6px 20px #0003;transition:all .3s ease}
.tryDemoLink:hover{transform:translate(-50%,-50%) scale(1.05);box-shadow:0 8px 26px #8d43f84d}
.demoNote{font-size:.95em;color:#666;text-align:center}
.workshopGrid{max-width:1000px;margin:0 auto 80px;padding:0 20px}
.workshopGrid h2{font-size:2.4em;margin:0 0 50px;color:#1a1a1a;text-align:center}
.workshopGrid h2::before{content:'';display:block;width:80px;height:4px;background:linear-gradient(90deg,#8D43F8 0%,#124735 100%);margin:0 auto 20px;border-radius:2px}
.gridLayout{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px}
.workshopCard{background:#fff;border-radius:10px;padding:32px;box-shadow:0 4px 16px #1247351f;transition:all .3s ease;border:2px solid transparent}
.workshopCard:hover{transform:translateY(-6px);box-shadow:0 12px 32px #8d43f82e;border-color:#8d43f84d}
.workshopCard h3{font-size:1.5em;margin:0 0 14px;color:#124735}
.workshopCard .desc{font-size:1.05em;color:#555;line-height:1.7;margin-bottom:20px}
.workshopCard .features{list-style:none;padding:0;margin:0}
.workshopCard .features li{padding:8px 0 8px 28px;position:relative;font-size:.95em;color:#4a4a4a}
.workshopCard .features li::before{content:'';position:absolute;left:0;top:14px;width:16px;height:16px;background:#8D43F8;border-radius:50%;opacity:.7}
.approachBlock{background:linear-gradient(165deg,#FFF3D3 0%,#fff 100%);padding:80px 20px;margin-bottom:80px}
.approachContent{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
.approachLeft h2{font-size:2.6em;margin:0 0 24px;color:#124735}
.approachLeft .statement{font-size:1.15em;color:#3a3a3a;line-height:1.7;margin-bottom:16px}
.approachRight .principle{background:#fff;padding:24px;border-radius:8px;margin-bottom:20px;box-shadow:0 3px 12px #1247351a}
.approachRight .principle h4{font-size:1.3em;margin:0 0 10px;color:#8D43F8}
.approachRight .principle p{font-size:1em;color:#555;margin:0;line-height:1.6}
.participateArea{max-width:1000px;margin:0 auto 60px;padding:0 20px;text-align:center}
.participateArea h2{font-size:2.2em;margin:0 0 30px;color:#1a1a1a}
.participateArea .cta{font-size:1.1em;color:#4a4a4a;margin-bottom:36px;line-height:1.6}
.actionButtons{display:flex;gap:20px;justify-content:center;flex-wrap:wrap}
.actionButtons .btn{padding:16px 40px;border-radius:8px;text-decoration:none;font-size:1.1em;font-weight:600;transition:all .3s ease;display:inline-block}
.actionButtons .btnPrimary{background:linear-gradient(135deg,#8D43F8 0%,#124735 100%);color:#fff;box-shadow:0 6px 18px #8d43f84d}
.actionButtons .btnPrimary:hover{transform:translateY(-3px);box-shadow:0 10px 28px #8d43f866}
.actionButtons .btnSecondary{background:#fff;color:#124735;border:2px solid #124735}
.actionButtons .btnSecondary:hover{background:#124735;color:#fff}
@media (max-width: 768px) {
.heroContent h1{font-size:2.2em}
.heroContent .tagline{font-size:1.1em}
.demoContainer{padding:24px}
.demoContainer h2{font-size:1.6em}
.tryDemoLink{padding:14px 32px;font-size:1em}
.workshopGrid h2{font-size:1.9em}
.gridLayout{grid-template-columns:1fr}
.approachContent{grid-template-columns:1fr;gap:40px}
.approachLeft h2{font-size:2em}
.participateArea h2{font-size:1.8em}
.actionButtons{flex-direction:column;align-items:stretch}
}
.successHero{position:relative;min-height:65vh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:linear-gradient(135deg,#f8f9fa 0%,#e9ecef 100%)}
.successHero::before{content:'"';position:absolute;top:-80px;right:8%;font-size:420px;line-height:1;color:#8D43F8;opacity:.04;font-weight:700;pointer-events:none}
.successHero::after{content:'';position:absolute;top:0;right:0;width:60%;height:100%;background:linear-gradient(90deg,transparent 0%,#8d43f808 100%);pointer-events:none}
.hero-contentBox{position:relative;z-index:2;max-width:700px;padding:60px 40px;text-align:center}
.hero-contentBox h1{font-size:3.2em;margin:0 0 24px;color:#124735;font-weight:700;line-height:1.2;animation:sharpReveal 1.2s ease-out forwards}
@keyframes sharpReveal {
0%{filter:blur(20px);opacity:0;transform:translateY(30px)}
100%{filter:blur(0);opacity:1;transform:translateY(0)}
}
.hero-contentBox .statusIcon{width:90px;height:90px;margin:0 auto 32px;background:linear-gradient(135deg,#8D43F8 0%,#a56af9 100%);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 32px #8d43f840;animation:pulseScale 2s ease-in-out infinite}
@keyframes pulseScale {
0%,100%{transform:scale(1)}
50%{transform:scale(1.08)}
}
.hero-contentBox .statusIcon svg{width:48px;height:48px;fill:#fff}
.hero-contentBox .messageText{font-size:1.15em;line-height:1.7;color:#495057;margin:0 0 36px}
.hero-contentBox .actionsRow{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.hero-contentBox .primaryBtn{padding:16px 38px;background:#8D43F8;color:#fff;text-decoration:none;border-radius:8px;font-size:1.05em;font-weight:600;transition:all .3s ease;box-shadow:0 6px 20px #8d43f84d;display:inline-block}
.hero-contentBox .primaryBtn:hover{background:#7a39d9;transform:translateY(-3px);box-shadow:0 10px 28px #8d43f866}
.hero-contentBox .secondaryBtn{padding:16px 38px;background:transparent;color:#124735;text-decoration:none;border:2px solid #124735;border-radius:8px;font-size:1.05em;font-weight:600;transition:all .3s ease;display:inline-block}
.hero-contentBox .secondaryBtn:hover{background:#124735;color:#fff;transform:translateY(-3px);box-shadow:0 8px 24px #12473540}
.infoGrid--wrapper{max-width:1000px;margin:0 auto;padding:80px 20px}
.infoGrid--wrapper h2{font-size:2.4em;color:#124735;margin:0 0 48px;text-align:center;font-weight:700}
.gridLayout{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.featureCard{background:#fff;padding:36px 28px;border-radius:10px;box-shadow:0 4px 16px #8d43f814;transition:all .4s ease;border:2px solid transparent;position:relative}
.featureCard::before{content:'';position:absolute;top:0;left:0;width:100%;height:4px;background:linear-gradient(90deg,#8D43F8 0%,#FFF3D3 100%);border-radius:10px 10px 0 0;opacity:0;transition:opacity .4s ease}
.featureCard:hover{transform:translateY(-8px);box-shadow:0 14px 36px #8d43f82e;border-color:#8D43F8}
.featureCard:hover::before{opacity:1}
.featureCard .iconBox{width:64px;height:64px;background:linear-gradient(135deg,#FFF3D3 0%,#fff9e6 100%);border-radius:12px;display:flex;align-items:center;justify-content:center;margin:0 0 24px}
.featureCard .iconBox svg{width:32px;height:32px;fill:#8D43F8}
.featureCard h3{font-size:1.35em;color:#124735;margin:0 0 14px;font-weight:600}
.featureCard .descText{font-size:.98em;line-height:1.65;color:#6c757d;margin:0}
@media (max-width: 768px) {
.successHero{min-height:50vh}
.successHero::before{font-size:280px;top:-50px;right:5%}
.hero-contentBox{padding:40px 24px}
.hero-contentBox h1{font-size:2.2em}
.hero-contentBox .statusIcon{width:75px;height:75px}
.hero-contentBox .statusIcon svg{width:38px;height:38px}
.hero-contentBox .messageText{font-size:1.05em}
.hero-contentBox .actionsRow{flex-direction:column}
.hero-contentBox .primaryBtn,.hero-contentBox .secondaryBtn{width:100%;text-align:center}
.infoGrid--wrapper{padding:60px 20px}
.infoGrid--wrapper h2{font-size:1.9em;margin-bottom:36px}
.gridLayout{grid-template-columns:1fr;gap:24px}
}
@media (min-width: 769px) and (max-width: 1024px) {
.hero-contentBox h1{font-size:2.8em}
.gridLayout{grid-template-columns:repeat(2,1fr)}
}