.kyo-landing-page{scroll-behavior:smooth}
#kyo-how{scroll-margin-top:clamp(20px,calc(50svh - 100px),350px)}
.kyo-landing{font-family:"Segoe UI",Arial,sans-serif;background:#f6f5f2;color:#20395c}
.kyo-landing .kyo-card{transition:transform .24s ease}
@media(hover:hover) and (pointer:fine){
 .kyo-landing .kyo-card:hover{transform:translateY(-4px)}
 .kyo-landing .kyo-card:focus-within{transform:translateY(-4px)}
}
@keyframes kyo-art-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.kyo-landing-hero-art>img{animation:kyo-art-float 7s ease-in-out infinite}
.kyo-feature-art>img,.kyo-guide-art>img{animation:kyo-art-float 8s ease-in-out infinite}
.kyo-landing-feature:nth-child(2) img{animation-delay:-2.5s}
.kyo-landing-feature:nth-child(3) img{animation-delay:-5s}
@media(max-width:640px){
 @keyframes kyo-art-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
}
@media(prefers-reduced-motion:reduce){
 .kyo-landing .kyo-card{transition:none}
 .kyo-landing-hero-art>img,.kyo-feature-art>img,.kyo-guide-art>img{animation:none;transform:none}
 .kyo-landing .kyo-card:hover,.kyo-landing .kyo-card:focus-within{transform:none}
}
.kyo-landing-wrap{max-width:1240px;margin:0 auto;padding:var(--kyo-layout-gap)}
.kyo-landing-header{display:flex;align-items:center;justify-content:space-between;gap:var(--kyo-layout-gap);padding-bottom:16px;border-bottom:1px solid #e1e8f3}
.kyo-landing-brand{display:flex;align-items:center;gap:10px;color:#153763;font-size:23px;text-decoration:none;flex-shrink:0}
.kyo-landing-brand:hover{text-decoration:none}
.kyo-landing-header nav{display:flex;align-items:center;gap:var(--kyo-layout-gap);font-size:13px}
.kyo-landing-header nav>a:not(.kyo-btn){color:#536b8b}
.kyo-landing-hero{display:grid;grid-template-columns:minmax(0,.96fr) minmax(0,1.04fr);align-items:center;gap:24px;padding:32px 0 36px}
.kyo-landing-hero-copy{padding-bottom:8px}
.kyo-landing-eyebrow,.kyo-landing-section-label{font-size:11px;letter-spacing:1.5px;font-weight:650;color:#627ea9;margin:0 0 16px;display:block}
.kyo-landing-hero h1{font-size:clamp(32px,3.45vw,46px);line-height:1.2;letter-spacing:-1.4px;margin:0 0 20px;font-weight:650}
.kyo-landing-hero h1 span{color:#245db5}
.kyo-landing-intro{max-width:490px;font-size:15px;line-height:1.8;color:#657c99;margin:0}
.kyo-landing-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:24px}
.kyo-landing-actions .kyo-btn{padding-left:16px;padding-right:16px;min-height:40px}
.kyo-landing-secondary{font-size:13px;color:#526f94}
.kyo-landing-platforms{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:22px;font-size:12px}
.kyo-platform-shopee,.kyo-platform-tiktok{display:inline-block;padding:5px 9px;border-radius:6px;font-weight:600;line-height:1.4}
.kyo-platform-shopee{background:#fff0e7;color:#be542c}
.kyo-platform-tiktok{background:#e6ecf5;color:#263d60}
.kyo-platform-caption{color:#7b8da6;margin-left:4px}
.kyo-landing-hero-art{margin:0;min-width:0}
.kyo-landing-hero-art img{display:block;width:100%;height:auto}
.kyo-landing-hero-art figcaption{text-align:center;font-size:12px;color:#7b8da6;margin-top:2px}
.kyo-landing-section{margin-bottom:32px;scroll-margin-top:20px}
.kyo-landing-section-title{margin-bottom:var(--kyo-layout-gap)}
.kyo-landing-section-title .kyo-landing-section-label,.kyo-landing-guide-intro .kyo-landing-section-label{margin-bottom:8px;font-size:10px}
.kyo-landing-section-title h2,.kyo-landing-guide h2,.kyo-landing-cta h2{font-size:23px;font-weight:600;letter-spacing:-.4px;margin:0 0 7px;line-height:1.4}
.kyo-landing-section-title p,.kyo-landing-cta p,.kyo-landing-guide-intro p{font-size:13px;line-height:1.7;color:#71809a;margin:0}
.kyo-landing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kyo-layout-gap)}
.kyo-landing-feature{overflow:hidden;display:flex;flex-direction:column}
.kyo-landing-feature:nth-child(1){border-color:#dfd8ec}
.kyo-landing-feature:nth-child(2){border-color:#d4e7df}
.kyo-landing-feature:nth-child(3){border-color:#e7dcc6}
.kyo-feature-art{display:grid;place-items:center;margin:0;padding:12px;aspect-ratio:1.85;overflow:hidden;border-bottom:1px solid #e8eef6;background:linear-gradient(130deg,#ede7f6,#f8f5fc,#eee5f5)}
.kyo-feature-art>img{display:block;width:100%;height:100%;min-height:0;object-fit:contain}
.kyo-landing-feature:nth-child(2) .kyo-feature-art{background:linear-gradient(130deg,#e0f0ec,#f0f8f5,#dfefeb)}
.kyo-landing-feature:nth-child(3) .kyo-feature-art{background:linear-gradient(130deg,#f2e8d6,#fcf6eb,#f0e4cf)}
.kyo-landing-feature>div{padding:var(--kyo-panel-inset)}
.kyo-landing-feature h3{font-size:16px;font-weight:600;margin:0 0 8px}
.kyo-landing-feature p{font-size:13px;line-height:1.75;color:#6a7e98;margin:0}
.kyo-landing-guide{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);column-gap:32px;row-gap:10px;align-items:center;padding:20px;margin-bottom:24px;scroll-margin-top:20px;background:linear-gradient(110deg,#f3e5d1 0%,#fff5e6 50%,#eedec4 100%);border-color:#dfc9a8;color:#534737;box-shadow:var(--kyo-colored-panel-shadow)}
.kyo-guide-art{grid-column:1;grid-row:2;margin:0;justify-self:start;width:min(100%,260px)}
.kyo-guide-art img{display:block;width:100%;height:auto}
.kyo-landing-guide .kyo-landing-section-label{color:#8a6c43}
.kyo-landing-guide h2{color:#4b4236;margin:0}
.kyo-landing-guide ol{display:grid;grid-column:2;grid-row:1/span 2;gap:18px;list-style:none;padding:0;margin:0}
.kyo-landing-guide li{display:flex;align-items:flex-start;gap:12px;font-size:13px;line-height:1.6;border-top:1px solid #d7c5aa;padding-top:14px}
.kyo-landing-guide .kyo-step-number{flex:none;font-size:26px;font-weight:650;line-height:1.25;color:#5f7da8;font-variant-numeric:tabular-nums}
.kyo-landing-guide li:nth-child(2) .kyo-step-number{color:#8962a9}
.kyo-landing-guide li:nth-child(3) .kyo-step-number{color:#3d8c7f}
.kyo-landing-guide li strong{color:#4b4236;font-size:14px}
.kyo-landing-guide li div>span{display:block;color:#7c6f5d;margin-top:4px}
#kyo-pricing .kyo-plan-grid{max-width:none;margin:0}
#kyo-pricing .kyo-landing-section-title{text-align:left;margin-bottom:16px}
#kyo-pricing .kyo-plan-card{padding:0;gap:0;overflow:hidden}
.kyo-landing-plan-top{padding:20px;display:grid;gap:10px;background:linear-gradient(110deg,#e9e1f5 0%,#f7f1ff 50%,#e7dcf3 100%);border-bottom:1px solid #dcd0e9;box-shadow:var(--kyo-colored-edge-shadow)}
.kyo-landing-plan-label{display:flex;align-items:center;justify-content:space-between;gap:12px}
.kyo-landing-plan-label>span{font-size:11px;font-weight:600;padding:4px 8px;border:1px solid #c6b4dd;border-radius:6px;color:#775a96;background:#ffffff70}
#kyo-pricing .kyo-plan-card h3{color:#674c86;font-size:18px}
#kyo-pricing .kyo-plan-price{margin:0;line-height:1.3;font-size:32px;color:#6f5197}
#kyo-pricing .kyo-landing-plan-detail{color:#806c98;font-size:12px}
.kyo-landing-plan-yearly .kyo-landing-plan-top{background:linear-gradient(110deg,#175e56 0%,#2a8477 50%,#14564e 100%);border-color:#317e72}
#kyo-pricing .kyo-landing-plan-yearly h3,#kyo-pricing .kyo-landing-plan-yearly .kyo-plan-price{color:#fff}
#kyo-pricing .kyo-landing-plan-yearly .kyo-landing-plan-detail{color:#d0eee6}
.kyo-landing-plan-yearly .kyo-landing-plan-label>span{color:#e0f4ed;border-color:#73b1a3;background:#ffffff12}
.kyo-landing-plan-lifetime .kyo-landing-plan-top{background:linear-gradient(110deg,#854623 0%,#aa6131 50%,#74401f 100%);border-color:#9b633e}
#kyo-pricing .kyo-landing-plan-lifetime h3,#kyo-pricing .kyo-landing-plan-lifetime .kyo-plan-price{color:#fff}
#kyo-pricing .kyo-landing-plan-lifetime .kyo-landing-plan-detail{color:#f4e0d1}
.kyo-landing-plan-lifetime .kyo-landing-plan-label>span{color:#fff0e4;border-color:#cb9874;background:#ffffff12}
.kyo-landing-plan-body{padding:20px;display:flex;flex-direction:column;gap:16px;flex:1;background:#fbfdff}
#kyo-pricing .kyo-landing-plan-body ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;line-height:1.6}
.kyo-landing-plan-body li{position:relative;padding-left:22px}
.kyo-landing-plan-body li::before{content:'✓';position:absolute;left:0;color:#2f876c;font-weight:700}
#kyo-pricing .kyo-form-actions{padding-top:12px;margin-top:auto}
.kyo-landing-cta{padding:20px;display:flex;align-items:center;justify-content:space-between;gap:var(--kyo-layout-gap);background:linear-gradient(110deg,#173349 0%,#285268 50%,#1c3d4e 100%);border-color:#325b70;box-shadow:var(--kyo-colored-panel-shadow)}
.kyo-landing-cta h2{color:#f0f6fb}
.kyo-landing-cta p{color:#c3d9e1}
.kyo-landing-footer{display:flex;justify-content:space-between;gap:var(--kyo-layout-gap);margin-top:var(--kyo-layout-gap);padding-top:16px;border-top:1px solid #e1e8f3;font-size:11px;color:#7a8da8}
@media(min-width:641px) and (max-width:900px){
 #kyo-pricing .kyo-plan-price small{display:block;margin:4px 0 0}
 .kyo-landing-hero{gap:8px;padding-top:24px}
 .kyo-landing-hero h1{font-size:34px}
 .kyo-landing-intro{font-size:14px}
 .kyo-platform-caption{flex-basis:100%;margin-left:0}
 .kyo-landing-actions{gap:12px}
 .kyo-landing-feature h3{font-size:15px}
}
@media(max-width:640px){
 .kyo-landing-section,.kyo-landing-guide{scroll-margin-top:14px}
 .kyo-landing-header{position:relative;flex-wrap:wrap;padding-bottom:14px}
 .kyo-landing-brand{font-size:19px;gap:8px}
 .kyo-landing-brand img{width:32px;height:32px}
 .kyo-landing-header nav{width:100%;justify-content:space-between;gap:8px;font-size:12px}
 .kyo-landing-header nav>.kyo-btn{position:absolute;top:0;right:0}
 .kyo-landing-hero{grid-template-columns:minmax(0,1fr);gap:12px;padding:28px 0}
 .kyo-landing-hero-copy{padding:0}
 .kyo-landing-eyebrow{font-size:10px;margin-bottom:12px;letter-spacing:1.2px}
 .kyo-landing-hero h1{font-size:32px;letter-spacing:-1px;margin-bottom:14px}
 .kyo-landing-intro{font-size:14px;line-height:1.75}
 .kyo-landing-actions{gap:14px;margin-top:18px}
 .kyo-landing-platforms{margin-top:16px}
 .kyo-platform-caption{flex-basis:100%;margin-left:0}
 .kyo-landing-hero-art{width:min(100%,460px);justify-self:center}
 .kyo-landing-hero-art figcaption{font-size:11px}
 .kyo-landing-grid{grid-template-columns:minmax(0,1fr)}
 .kyo-landing-feature{display:grid;grid-template-columns:102px minmax(0,1fr)}
 .kyo-feature-art{width:100%;height:100%;min-height:120px;aspect-ratio:auto;padding:4px;border-bottom:0;border-right:1px solid #e8eef6}
 .kyo-landing-feature h3{font-size:15px}
 .kyo-landing-feature p{font-size:12px;line-height:1.7}
 .kyo-landing-section{margin-bottom:24px}
 .kyo-landing-section-title h2,.kyo-landing-guide h2,.kyo-landing-cta h2{font-size:20px}
 .kyo-landing-guide{grid-template-columns:minmax(0,1fr);gap:14px;padding:var(--kyo-panel-inset);margin-bottom:24px}
 .kyo-guide-art{grid-column:1;grid-row:2;width:min(100%,220px);justify-self:center}
 .kyo-landing-guide ol{grid-column:1;grid-row:3;grid-template-columns:minmax(0,1fr);gap:12px}
 .kyo-landing-guide li{padding-top:12px}
 #kyo-pricing .kyo-plan-card{padding:0}
 .kyo-landing-plan-top,.kyo-landing-plan-body{padding:14px}
 #kyo-pricing .kyo-landing-section-title{text-align:left}
 .kyo-landing-cta{align-items:flex-start;flex-direction:column;padding:var(--kyo-panel-inset)}
 .kyo-landing-cta>.kyo-btn{align-self:flex-end}
}
