:root{--bg:#090a0e;--panel:#15171e;--text:#f4f4f8;--muted:#9397a9;--violet:#a69aff}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input{font:inherit}button,a,input,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid #b6a5ff;outline-offset:5px}header{height:80px;position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:0 max(5%,calc((100vw - 1280px)/2));background:#090a0edb;border-bottom:1px solid #ffffff0b;backdrop-filter:blur(22px)}.brand{display:flex;align-items:center;gap:10px;font-size:24px;font-weight:750;letter-spacing:-.8px}.brand-icon{color:#bdb1ff;font-size:34px}.by{font-weight:400;font-size:11px;color:var(--muted);margin-left:7px;letter-spacing:0}nav{display:flex;align-items:center;gap:30px;font-size:13px;color:#b2b4c1}.nav-buy{background:#edeafc;color:#252133;border-radius:9px;padding:12px 19px;font-weight:650}.hero{position:relative;overflow:hidden;text-align:center;padding:72px 5% 0}.glow{position:absolute;z-index:-1;top:0;left:10%;width:80%;height:850px;background:radial-gradient(ellipse,#39235c55,transparent 66%);pointer-events:none}.eyebrow{font-size:12px;letter-spacing:2.4px;color:#ad9de2;font-weight:650}.hero .eyebrow{display:inline-flex;align-items:center;gap:10px;border:1px solid #c0aaff28;background:#8b68cb0d;padding:9px 15px;border-radius:50px;letter-spacing:1px}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#ad99ff;box-shadow:0 0 12px #bba5ff}h1{font-size:clamp(48px,6.4vw,88px);line-height:1.19;letter-spacing:-4px;margin:24px 0}h2{font-size:clamp(34px,4vw,56px);line-height:1.3;letter-spacing:-2px;margin:16px 0 22px}h3{margin:0}.gradient{background:linear-gradient(105deg,#d6c3ff 0%,#ac9fff 45%,#7ba8ff 100%);background-clip:text;-webkit-text-fill-color:transparent}.lead{font-size:17px;color:#a7a6b8;line-height:1.85}.actions{display:flex;align-items:center;justify-content:center;gap:30px;margin:28px 0 20px}.button{border:0;display:inline-flex;align-items:center;justify-content:center;gap:22px;padding:17px 24px;border-radius:11px;background:linear-gradient(100deg,#bfa5ff,#9298ff);color:#171226;font-size:14px;font-weight:700;box-shadow:0 5px 35px #b389ff20;transition:transform .2s}.button:hover{transform:translateY(-3px)}.text-link{font-size:14px;color:#c8c7d7}.compat{font-size:11px;color:#777789}.compat span{margin:0 12px}.hero-stage{max-width:1130px;position:relative;margin:58px auto 0}.app-window{border:1px solid #ffffff24;border-radius:14px;overflow:hidden;text-align:left;background:#1a1c24;box-shadow:0 0 100px #8e6cce17,0 30px 100px #0008;transform:perspective(1600px) rotateX(4deg)}.window-bar{height:38px;background:#20212b;display:flex;align-items:center;justify-content:space-between;padding:0 16px;color:#818392;font-size:10px}.traffic{color:#786d8b;letter-spacing:3px}.app-body{display:grid;grid-template-columns:220px 1fr;padding:12px;gap:12px}.app-body aside{padding:22px 16px;position:relative}.tiny-label{font-size:8px;letter-spacing:1.8px;color:#8a879b;margin:0 0 10px}.app-body h3{font-size:17px}.source-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:19px 0 30px}.source-tiles svg{background:#2c2936;border-radius:7px;width:100%;height:54px}.side-option{padding:13px 10px;margin:6px 0;border-radius:6px;font-size:12px;color:#858694}.side-option.selected{background:#353044;color:#d3c7ef}.side-option span{float:right;color:#bbaaeb}.side-foot{position:absolute;bottom:20px;font-size:9px;color:#8e899c}.side-foot .dot{width:4px;height:4px;margin-right:4px}.artboard{position:relative;overflow:hidden;border-radius:5px;background:#eee8da}.artboard svg{width:100%;display:block}.artboard-label{position:absolute;bottom:14px;left:22px;right:22px;font-size:7px;letter-spacing:2px;color:#616952;display:flex;justify-content:space-between}.float-tag{position:absolute;z-index:2;padding:13px 17px;background:#292336e8;backdrop-filter:blur(10px);border:1px solid #ad93d344;box-shadow:0 8px 25px #0004;border-radius:12px;font-size:11px;color:#d2c8e5;animation:float 5s ease-in-out infinite}.left-tag{top:85px;left:-35px;transform:rotate(-6deg)}.right-tag{bottom:70px;right:-35px;animation-delay:-2s}.stage-caption{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#737183;margin:24px 0}.stage-caption span{font-size:8px;letter-spacing:1.4px;color:#b6a8d4}.applications{padding:75px 5% 65px;text-align:center;border-bottom:1px solid #ffffff0b}.applications p{color:#6d6f7b;font-size:11px;margin-bottom:28px}.applications div{display:flex;justify-content:center;align-items:center;gap:35px;color:#b1afbc;font-size:18px;font-weight:550}.applications b{font-size:16px;color:#5a506d}.section{padding:100px 5%;max-width:1380px;margin:auto}.section-heading{text-align:center;margin-bottom:46px}.section-heading>p:last-child{font-size:15px;color:#999aab;line-height:1.9}.playground{border:1px solid #ffffff17;border-radius:18px;overflow:hidden;background:#17161e}.play-top,.play-bottom{display:flex;align-items:center;justify-content:space-between;padding:17px 24px;gap:16px}.tabs{display:flex;gap:8px}.tabs button,.small-button{border:0;background:transparent;color:#93909f;font-size:12px;padding:10px 16px;border-radius:8px}.tabs button.active{color:#e2d8ff;background:#393044}.small-button{border:1px solid #ffffff16}.small-button:hover{color:white;background:#ffffff0a}#demo-pattern{width:100%;display:block;background:#e9ead7;transition:background .6s}.play-bottom{color:#8d899d;font-size:11px}.play-bottom label{display:flex;align-items:center;gap:18px}.play-bottom input{width:220px;accent-color:#bda5f3}.play-bottom output{min-width:36px;color:#d7cbea}.footnote{font-size:10px;color:#777487;text-align:center;margin-top:18px}.features{padding-top:65px}.shape-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.shape-art{position:relative;overflow:hidden;border-radius:13px;background:#dadfcf}.shape-art.pink{background:#ead7d6}.shape-art.blue{background:#d6dae8}.shape-art svg{display:block;width:100%}.shape-label{position:absolute;left:18px;bottom:18px;font-size:8px;letter-spacing:1.5px;color:#5d625c}.shape-card h3{font-size:20px;margin:24px 0 12px}.shape-card p{color:#9393a5;font-size:13px;line-height:1.85;margin:0;max-width:340px}.workflow{background:linear-gradient(180deg,#121018,#090a0e);max-width:none}.workflow-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px;max-width:1050px;margin:auto;align-items:center}.step-list{display:flex;flex-direction:column;gap:14px}.step{padding:25px 23px;display:flex;gap:20px;border:1px solid transparent;border-radius:14px;background:transparent;color:#9995a9;text-align:left;transition:.3s}.step>span{font-size:13px;letter-spacing:1px;color:#786b97;padding-top:3px}.step h3{font-size:20px;font-weight:550}.step p{font-size:13px;line-height:1.9;margin:10px 0 0;color:#8a8797}.step.active{background:#201b2b;border-color:#a28acd33;color:#f1eaff}.step.active>span{color:#c6a8f2}.step-list>.text-link{margin:18px 23px}.real-panel{margin:0;background:#1e1f25;border:1px solid #a593c02b;border-radius:16px;overflow:hidden;padding:16px 16px 0;box-shadow:0 20px 90px #0004}.panel-title{font-size:10px;color:#a39bad;margin-bottom:16px;display:flex;gap:9px;align-items:center}.panel-title>span:last-child{margin-left:auto;font-size:9px}.real-panel img{display:block;width:100%;max-height:650px;object-fit:contain;object-position:top;background:#24272b;border-radius:8px}.real-panel figcaption{padding:16px 0;font-size:11px;color:#b1a3c5}.preset-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:95px;align-items:center;max-width:1100px;margin:auto}.preset figure{padding:25px;background:radial-gradient(ellipse at bottom,#5d476c66,#1b1825);border:1px solid #b69ad922;border-radius:18px;margin:0}.preset img{width:100%;max-height:490px;object-fit:contain;border-radius:10px}.preset figcaption{font-size:10px;color:#92909b;margin-top:15px}.preset-layout>div>p{font-size:14px;color:#a09aae;line-height:1.9}.preset-layout>div>.eyebrow{font-size:10px;color:#b19ae2}.preset-chips{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0}.preset-chips span{font-size:11px;padding:10px 15px;border:1px solid #9a7fc535;border-radius:8px;background:#20192d;color:#c9b4e7}.muted{font-size:11px!important;color:#777285!important;line-height:1.9}.faq{max-width:950px;padding-top:45px}.faq-list{border-top:1px solid #ffffff16}.faq details{border-bottom:1px solid #ffffff16;padding:23px 0}.faq summary{list-style:none;cursor:pointer;font-size:15px}.faq summary:after{content:'+';float:right;color:#998aaf;font-size:20px}.faq details[open] summary:after{content:'−'}.faq details p{font-size:13px;color:#9994a7;line-height:1.9;max-width:730px}.purchase{position:relative;overflow:hidden;text-align:center;margin:20px auto 80px;max-width:1230px;padding:90px 30px;background:radial-gradient(ellipse at 50% 100%,#40305688,transparent 75%),#141019;border:1px solid #b192ce22;border-radius:24px}.purchase h2{font-size:clamp(36px,4.5vw,64px)}.purchase>p{font-size:12px;color:#aca3ba}.purchase-orbit{position:absolute;font-size:360px;top:20px;right:-100px;color:#ac89db06;animation:rotate 100s linear infinite;pointer-events:none}.price{font-size:28px;margin:30px 0 25px}.price span{font-size:10px;color:#82768d;margin-left:8px}.purchase .text-link{margin-left:22px}.purchase .muted{margin-top:22px}footer{border-top:1px solid #ffffff12;padding:30px 5%;display:flex;align-items:center;justify-content:space-between;color:#737181;font-size:11px}footer .brand{font-size:18px;color:#beb4cc}dialog{max-width:460px;width:90%;background:#211b2d;color:white;border:1px solid #66527f;border-radius:18px;padding:38px}dialog::backdrop{background:#000a;backdrop-filter:blur(8px)}dialog h3{font-size:23px}dialog>p:not(.eyebrow){font-size:14px;line-height:1.8;color:#bbb0cd}dialog .close{position:absolute;top:10px;right:14px;background:none;border:0;color:white;font-size:25px}.reveal{opacity:1;transform:none}.motion-ready .reveal{opacity:0;transform:translateY(30px);transition:opacity .8s,transform .8s}.motion-ready .reveal.visible{opacity:1;transform:none}.flower{animation:bloom 1s both;transform-box:fill-box;transform-origin:center}.pattern-moving{animation:sway 8s ease-in-out infinite;transform-box:fill-box;transform-origin:center}body.paused .pattern-moving,body.paused .float-tag,body.paused .purchase-orbit{animation-play-state:paused}@keyframes bloom{from{opacity:0;scale:.3}to{opacity:1;scale:1}}@keyframes sway{0%,100%{rotate:-3deg}50%{rotate:3deg}}@keyframes float{50%{translate:0 -12px}}@keyframes rotate{to{rotate:360deg}}@media(max-width:900px){nav{gap:18px}.by{display:none}.app-body{grid-template-columns:165px 1fr}.app-body aside{padding:12px 8px}.source-tiles svg{height:35px}.side-foot{display:none}.float-tag{display:none}.applications div{gap:18px;font-size:14px}.workflow-layout{gap:30px}.preset-layout{gap:35px}.section{padding:75px 5%}}@media(max-width:600px){header{height:66px;padding:0 5%}.brand{font-size:20px}nav>a:not(.nav-buy){display:none}.nav-buy{font-size:11px;padding:10px 12px}.hero{padding-top:42px}h1{font-size:49px;letter-spacing:-2.5px}.hero .eyebrow{font-size:9px}.lead{font-size:13px}.actions{gap:17px}.button{font-size:12px;padding:15px 18px}.text-link{font-size:12px}.compat{font-size:9px}.hero-stage{margin-top:35px}.app-body{grid-template-columns:85px 1fr;padding:6px;gap:6px}.app-body aside{padding:9px 4px}.app-body h3{font-size:10px}.tiny-label{font-size:5px;margin-bottom:6px}.source-tiles{gap:3px;margin:8px 0 14px}.source-tiles svg{height:24px}.side-option{font-size:7px;padding:7px 3px}.window-bar{height:26px;font-size:7px;padding:0 9px}.artboard-label{font-size:4px;letter-spacing:1px;bottom:7px;left:8px;right:8px}.stage-caption{font-size:8px;gap:10px;text-align:right}.stage-caption span{font-size:6px;flex-shrink:0}.applications{padding:35px 5%}.applications div{flex-wrap:wrap;gap:13px;font-size:12px}.applications b{font-size:10px}.section{padding:60px 5%}.section-heading{margin-bottom:28px}h2{font-size:35px;letter-spacing:-1.8px}.section-heading>p:last-child{font-size:13px}.eyebrow{font-size:9px;letter-spacing:1.8px}.play-top{padding:10px;gap:4px}.tabs{gap:2px}.tabs button{font-size:10px;padding:9px 8px}.small-button{font-size:9px;padding:8px}.play-bottom{padding:12px;flex-wrap:wrap;gap:8px}.play-bottom label{gap:10px;font-size:10px}.play-bottom input{width:120px}.play-bottom>span{display:none}.footnote{font-size:9px;line-height:1.8}.shape-grid{grid-template-columns:1fr;gap:36px}.shape-card h3{margin:18px 0 10px}.shape-card p{max-width:none}.workflow-layout,.preset-layout{grid-template-columns:1fr;gap:30px}.step{padding:18px}.step h3{font-size:18px}.real-panel img{max-height:540px}.preset-layout>div{grid-row:1}.preset figure{padding:18px}.purchase{margin:10px 5% 50px;padding:60px 18px}.purchase .text-link{display:block;margin:22px 0 0}.price span{display:block;margin:8px 0 0}footer{flex-wrap:wrap;gap:20px}footer>span{order:3;width:100%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.motion-ready .reveal{opacity:1;transform:none}}
@media(max-width:600px){h1{font-size:clamp(32px,9.6vw,42px);letter-spacing:-1.5px}}
/* Step-specific visuals: source photograph, targets illustration, preview illustration. */
.workflow-layout{grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);max-width:1250px;gap:42px}.workflow-visual{padding:20px 20px 0;background:#18141f;min-width:0}.workflow-visual .panel-title{gap:8px;flex-wrap:wrap;line-height:1.7}.workflow-image-button{position:relative;display:block;width:100%;padding:0;background:none;border:0;text-align:left;color:#d4c6e8}.workflow-image-frame{position:relative;aspect-ratio:3/2;overflow:hidden;border-radius:10px;background:#17131f}.workflow-visual .workflow-image-frame img{position:absolute;width:100%;height:100%;max-height:none;object-fit:contain;object-position:center;border-radius:0;background:none}.workflow-visual .source-focus{background:white}.workflow-visual .source-focus img{width:259.222%;height:auto;left:-55.556%;top:-60%;object-fit:initial}.zoom-hint{position:absolute;bottom:12px;right:12px;background:#1d1629d9;border:1px solid #b49bd94a;padding:7px 10px;border-radius:7px;font-size:9px}.visual-labels{display:flex;gap:10px;margin-top:20px}.visual-labels span{flex:1;text-align:center;font-size:11px;padding:11px 6px;border:1px solid #b79dd529;background:#241c30;border-radius:8px;color:#d2bfe7}.workflow-visual figcaption{font-size:12px;line-height:1.8;padding:17px 0 8px}.visual-note{color:#81758e;font-size:10px;line-height:1.8;margin:0 0 20px}.preset-detail{display:block;position:relative;aspect-ratio:1040/735;overflow:hidden;border-radius:10px}.preset .preset-detail img{position:absolute;top:-25%;left:0;width:100%;height:auto;max-height:none;object-fit:initial}.preset figure>.eyebrow{margin:0 0 18px;font-size:10px}#image-dialog{max-width:95vw;width:1400px;padding:25px;border-color:#66527f}#image-dialog img{display:block;max-height:78vh;max-width:100%;width:auto;height:auto;object-fit:contain;margin:auto}#image-dialog-label{font-size:13px!important;margin:0 30px 20px 0}#image-dialog-caption{font-size:11px!important;margin-bottom:0}.workflow-image-button:hover .zoom-hint{background:#3a2b51}@media(max-width:900px){.workflow-layout{gap:25px;grid-template-columns:minmax(245px,.75fr) minmax(0,1.25fr)}.step{padding:20px 15px;gap:13px}.step h3{font-size:18px}}@media(max-width:600px){.workflow-layout{grid-template-columns:1fr;gap:20px}.workflow-visual{padding:14px 14px 0}.workflow-visual .panel-title{font-size:9px}.visual-labels{gap:7px;margin-top:14px}.visual-labels span{font-size:10px;padding:9px 4px}.workflow-visual figcaption{font-size:11px}.visual-note{font-size:9px}.step{padding:17px}.step p{font-size:12px}}

.header-origin{display:flex;align-items:center;gap:22px}.home-link{font-size:12px;color:#b5afc9;white-space:nowrap}.home-link:hover{color:#fff}@media(max-width:900px){.header-origin{gap:14px}.home-link{font-size:11px}}@media(max-width:600px){.header-origin{gap:10px}.home-link{font-size:10px}.header-origin .brand{font-size:17px}.header-origin .brand-icon{font-size:23px}.nav-buy{font-size:10px;padding:10px}}

/* Native commerce integration and WordPress layout reset, only on this template. */
body.patturn-landing{margin:0;background:var(--bg);color:var(--text);font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif}
.patturn-landing main{width:100%;max-width:none;margin:0;padding:0}.patturn-landing h1,.patturn-landing h2,.patturn-landing h3{color:inherit;font-family:inherit}.patturn-landing .button{border:0;line-height:1.4}.patturn-landing a{color:inherit}.patturn-landing .nav-buy,.patturn-landing .button{color:#201831}
.patturn-landing .price .woocommerce-Price-amount,.patturn-landing .price .woocommerce-Price-currencySymbol{display:inline;margin:0;color:inherit}.patturn-landing .price .woocommerce-Price-currencySymbol{font-size:inherit}.patturn-landing .price>.woocommerce-Price-amount{font-size:28px}
.patturn-landing.admin-bar>header{top:32px}.native-purchase{margin:28px auto;max-width:650px}.native-purchase form.cart{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:14px;margin:0!important}.native-purchase .quantity:has(input[type="hidden"]){display:none}.native-purchase .quantity input{width:72px;padding:12px;border-radius:8px}.native-purchase .button,.native-purchase a.button{float:none!important;margin:0!important;border-radius:10px!important;background:#eee9ff!important;color:#201831!important;padding:16px 25px!important;font-family:inherit!important;font-size:14px!important}.native-purchase .stock{color:#b5a2d0!important}.native-purchase .woocommerce-notices-wrapper{color:#201831}.patturn-landing .woocommerce-Price-amount{color:inherit}.patturn-landing .price .amount{font-size:28px}.patturn-landing .compat .amount{font-size:inherit}.patturn-landing .price del{font-size:16px;opacity:.6}.patturn-landing .price ins{background:none;text-decoration:none}.patturn-landing button:focus-visible,.patturn-landing a:focus-visible{outline:2px solid #bca3f5;outline-offset:4px}
@media(max-width:600px){.native-purchase form.cart{flex-direction:column;align-items:stretch}.native-purchase .button,.native-purchase a.button{width:100%!important;box-sizing:border-box!important}.patturn-landing.admin-bar>header{top:46px}}
