/* WANTY V12 — folded-ribbon identity and interface refinement. */
:root{--purple:#7135df;--purple-dark:#5520b7;--ink:#201334;--muted:#716a7f;--line:#e8e3f0;--wash:#f8f7fc;--brand-gradient:linear-gradient(115deg,#5425c4 0%,#7939e4 57%,#9552ef 100%)}
.brand{display:inline-flex;line-height:1;letter-spacing:0;flex-shrink:0}
.brand img{width:162px;height:43px;object-fit:contain}
.brand .brand-light{display:none}
.footer .brand-dark,.auth-visual .brand-dark,.sidebar .brand-dark{display:none}
.footer .brand-light,.auth-visual .brand-light,.sidebar .brand-light{display:block}
.btn{border-radius:11px;transition:transform .2s,box-shadow .2s,background .2s}
.btn-primary{background:var(--brand-gradient);box-shadow:0 5px 16px #6331d422,inset 0 1px 0 #ffffff30}
.btn-primary:hover{background:linear-gradient(115deg,#4d1dae,#6925cf 57%,#8640e2);box-shadow:0 9px 24px #6331d434}
.btn-dark{background:linear-gradient(115deg,#24133e,#39205b);box-shadow:inset 0 1px 0 #ffffff16}
.btn-outline{background:#ffffff80;border-color:#d8cfe7}
.announcement{background:linear-gradient(110deg,#180d2c,#34145f 50%,#291944);font-size:11px;min-height:34px}
.nav-row{height:80px;gap:45px}
.nav{font-size:13px}
.header{background:#ffffffed;border-bottom-color:#eee9f4}
.hero{position:relative;background:radial-gradient(ellipse at 78% 42%,#e2d6ff 0,transparent 48%),radial-gradient(ellipse at 25% 10%,#fff 0,transparent 55%),linear-gradient(120deg,#faf8ff,#f7f4ff 58%,#eaf0ff);padding:88px 0 80px}
.hero:before{content:'';position:absolute;width:610px;height:610px;border:1px solid #ffffffb0;border-radius:50%;right:-70px;top:-160px;box-shadow:0 0 0 78px #ffffff28,0 0 0 79px #ffffff58,0 0 0 162px #ffffff20;pointer-events:none}
.hero-grid{position:relative;gap:48px;grid-template-columns:1.03fr 1fr}
.hero-copy h1{font-size:clamp(42px,4.65vw,65px);letter-spacing:-.054em}
.hero-copy h1 em,.page-intro h1 em,.product-grid h1 em{background:linear-gradient(100deg,#5423b9,#8640e5 62%,#795bde);background-clip:text;color:transparent}
.hero-pill{background:#ffffffa6;border-color:#ded3f1;color:#6c3ca3;box-shadow:0 3px 12px #41216406;font-size:11px;letter-spacing:.025em;padding:7px 12px}
.hero-copy>p{font-size:16px;line-height:1.8;max-width:445px}
.hero-checks{font-size:11px;gap:18px}
.hero-stage{padding:45px 5px 70px}
.stage-caption{font-size:9px;letter-spacing:.18em;margin-bottom:19px;color:#796a94}
.hero-browser{border:5px solid #ffffffad;box-shadow:0 30px 70px #47327624,0 0 0 1px #d2c3ed88;transform:rotate(-2deg);border-radius:16px;position:relative;z-index:1}
.floating-note{z-index:3;top:31px;right:-5px;border:1px solid #e7dfef;box-shadow:0 12px 36px #30195b14}
.floating-editor{z-index:3;bottom:24px;left:34px;right:15px;background:linear-gradient(115deg,#291544,#492370);color:white;border:1px solid #a57be261;box-shadow:0 18px 45px #47277725;padding:17px 20px}
.floating-editor>span{background:#ffffff0e;border:1px solid #ffffff12;width:52px;border-radius:12px}
.floating-editor>span img{width:44px;height:26px;object-fit:contain}
.floating-editor small{color:#c7afdF;font-size:8px}
.floating-editor b{font-size:12px;letter-spacing:.01em}
.floating-editor>.icon{color:#dac4ff}
.platform-strip{background:#fff;padding:25px 0}
.platform-strip .container>div{font-size:12px}
.platform-strip .icon{color:#8855ca}
.feature-icon,.plan-icon{background:linear-gradient(135deg,#f5eefe,#ece4fb);box-shadow:inset 0 1px 0 #fff;border:1px solid #ebe1f8}
.benefit-grid{gap:22px}
.benefit-grid article{padding:28px 25px;border:1px solid #ebe5f2;border-radius:18px;background:linear-gradient(145deg,#fff,#fcfbff);box-shadow:0 7px 23px #28114a03;transition:transform .2s,border-color .2s}
.benefit-grid article:hover{transform:translateY(-4px);border-color:#cbb8e8}
.benefit-grid h3{font-size:19px}
.benefit-grid p{font-size:13px}
.showcase{background:linear-gradient(160deg,#f8f7fc,#f3f0fa)}
.template-card{background:white;padding:10px;border:1px solid #e9e3f0;border-radius:21px;box-shadow:0 10px 30px #27124106}
.template-visual{min-height:305px;border-radius:14px;box-shadow:none}
.template-meta{padding:20px 10px 13px;gap:9px}
.template-meta .btn{font-size:11px;padding:8px 11px;gap:6px}
.template-meta h3{font-size:16px}
.template-meta p{font-size:11px}
.price-card{box-shadow:0 8px 25px #29154304;border-radius:20px}
.price-card.featured{border-color:#935fea;box-shadow:0 18px 50px #6830be12;background:linear-gradient(180deg,#f7f2ff,#fff 43%)}
.recommended{background:var(--brand-gradient)}
.billing-switch{background:#f2eef8;border:1px solid #e6ddef;padding:5px;border-radius:13px}
.billing-switch button{border-radius:8px}
.enterprise-art{background:radial-gradient(ellipse at 100% 10%,#6734b770,transparent 70%),linear-gradient(140deg,#190c30,#2a124b);min-height:470px;padding:40px;isolation:isolate}
.enterprise-art:before{content:'';position:absolute;width:440px;height:440px;border:1px solid #ba82ff25;border-radius:50%;right:-145px;top:-120px;box-shadow:0 0 0 55px #aa6bf909,0 0 0 56px #d1aeff0d;z-index:-1}
.enterprise-art h3{font-size:35px;position:relative;z-index:2;margin:28px 0 24px}
.enterprise-monogram{position:absolute;width:220px;height:135px;object-fit:contain;right:19px;bottom:50px;transform:rotate(-12deg);filter:drop-shadow(0 14px 25px #18052470);opacity:.92}
.enterprise-tags{position:relative;z-index:2;max-width:170px;gap:7px}
.enterprise-tags>span{font-size:10px;padding:5px 11px;background:#ffffff06}
.closing{position:relative;overflow:hidden;background:radial-gradient(ellipse at 95% 20%,#b37af54d,transparent 45%),linear-gradient(105deg,#341269,#5d28b8 50%,#803cdc);padding:75px 0}
.closing:after{content:'';position:absolute;width:380px;height:380px;border:1px solid #fff1;border-radius:50%;right:-85px;top:-160px;box-shadow:0 0 0 45px #ffffff07,0 0 0 46px #ffffff0d;pointer-events:none}
.closing-row{position:relative;z-index:1}
.footer{background:radial-gradient(ellipse at 0 0,#2b1848,transparent 65%),#130c20;border-top:1px solid #ffffff0a}
.page-intro{background:radial-gradient(ellipse at 50% 0,#eee5fd,transparent 72%)}
.auth-visual{position:relative;isolation:isolate;background:radial-gradient(ellipse at 90% 30%,#6927ad55,transparent 65%),linear-gradient(145deg,#170b2e,#321752);overflow:hidden}
.auth-monogram{position:absolute;right:-20px;bottom:35px;width:250px;height:170px;object-fit:contain;opacity:.22;z-index:-1;transform:rotate(-10deg)}
.auth-visual:before{content:'';position:absolute;right:-180px;top:-140px;width:620px;height:620px;border:1px solid #c6a0ff16;border-radius:50%;box-shadow:0 0 0 60px #c4a2ff06;z-index:-1}
.auth-visual .brand img{width:185px;height:49px}
.auth-content{background:radial-gradient(ellipse at 90% 0,#f7f1ff,transparent 60%),#fff}
.sidebar{background:radial-gradient(ellipse at 40% 0,#39205980,transparent 60%),#1b102f;border-color:#ffffff08;color:#f8f3ff}
.sidebar .brand{margin-left:10px;margin-bottom:32px}
.sidebar .brand img{width:161px;height:43px}
.sidebar nav>a{color:#c5b7da;font-weight:500;border:1px solid transparent}
.sidebar nav>a:hover{background:#ffffff08;color:white}
.sidebar nav>a.active{color:white;background:linear-gradient(110deg,#7140ba80,#6b32a84a);border-color:#b58be82b;box-shadow:inset 3px 0 #c697ff}
.workspace-label{color:#a593bd}
.sidebar-divider{background:#ffffff0e}
.sidebar-tip{background:linear-gradient(135deg,#ab67fb12,#ffffff03);border:1px solid #b27aee24;color:#ece1fc}
.sidebar-tip p{color:#b5a1ce}
.sidebar-tip .text-link{color:#d2a9ff}
.user-card{border-color:#ffffff13}
.user-card small{color:#b6a3ce}
.user-card button{color:#c3afd9}
.avatar{background:linear-gradient(140deg,#9360d4,#533b85);color:white;border:1px solid #ba89ed4d}
.app-body{background:#f7f6fb}
.app-topbar{border-bottom-color:#eae3f2}
.welcome-banner{position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 90% 0,#7643b958,transparent 58%),linear-gradient(115deg,#2d174d,#46216b);color:white;border:1px solid #654091;border-radius:18px;min-height:157px}
.welcome-banner:after{content:'';position:absolute;right:22%;top:-95px;width:260px;height:260px;border:1px solid #dbbaff17;border-radius:50%;box-shadow:0 0 0 38px #ffffff04;z-index:-1}
.welcome-banner h2{font-size:25px}
.welcome-banner p{color:#d5c2e9;max-width:470px}
.welcome-banner .btn{background:#fff;color:#62309a;box-shadow:0 6px 20px #16042e20}
.stat-card{border-radius:15px;border-color:#e7dfed;box-shadow:0 6px 20px #2d154003}
.stat-card>div{color:#756686}
.stat-card .icon{background:#f1eafa;color:#8254bb;box-sizing:content-box;padding:7px;border-radius:9px}
.stat-card>small{color:#80748f}
.panel{border-radius:16px;border-color:#e5dfed;box-shadow:0 5px 20px #25133803}
.site-row{transition:background .2s}
.site-row:hover{background:#fcfaff}
.badge{border-radius:7px}
.editor-topbar{box-shadow:0 3px 14px #32184405}
.editor-topbar .brand img{width:138px;height:37px}
.editor-preview-wrap{background:radial-gradient(ellipse at 20% 0,#e6ddf5,transparent 70%),#efedf6}
.preview-frame{box-shadow:0 15px 40px #2d154d17;border:1px solid #d8cfe4}
.editor-tabs .active{color:var(--purple)}
.editor-bottom{background:linear-gradient(110deg,#f7f2fd,#fff);color:#8e6eb4}
.palette-label{font-size:13px;font-weight:650;color:var(--ink);margin:23px 0 10px}
.palette-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:0 0 21px}
.palette-choice{display:flex;align-items:center;gap:8px;min-height:51px;padding:9px;border:1px solid #e4dcec;background:#fff;border-radius:9px;text-align:left;font-size:11px}
.palette-choice:hover{background:#faf6ff;border-color:#ae86df}
.palette-choice.active{border-color:#8952cb;background:#f6efff;box-shadow:0 0 0 1px #8952cb}
.palette-colors{display:flex;align-items:center;gap:3px;flex-shrink:0}
.palette-colors i{width:17px;height:24px;display:block;border-radius:4px;background:var(--swatch);border:1px solid #00000008}
.palette-violeta i:first-child{--swatch:#7135df}.palette-violeta i:last-child{--swatch:#b79aeb}
.palette-oliva i:first-child{--swatch:#355b46}.palette-oliva i:last-child{--swatch:#b9bd91}
.palette-oceano i:first-child{--swatch:#165966}.palette-oceano i:last-child{--swatch:#86bec6}
.palette-terracota i:first-child{--swatch:#8b463a}.palette-terracota i:last-child{--swatch:#d3aa88}
.palette-grafite i:first-child{--swatch:#30313c}.palette-grafite i:last-child{--swatch:#a7a6b8}
.palette-editorial i:first-child{--swatch:#6e5948}.palette-editorial i:last-child{--swatch:#bfaa8c}
.palette-help{font-size:11px;margin:0 0 18px}
.product-tour{background:white}
.tour-layout{display:grid;grid-template-columns:.86fr 1.14fr;gap:65px;align-items:center}
.tour-copy h2{font-size:42px}
.tour-copy>p{font-size:15px;line-height:1.8;margin:22px 0}
.tour-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:28px 0 19px}
.tour-tabs button{display:inline-flex;align-items:center;gap:7px;border:1px solid #e3dbea;border-radius:9px;padding:9px 13px;font-size:12px;background:#fff;color:#6c5a82}
.tour-tabs button[aria-selected=true]{background:#eee4fc;border-color:#bc9ae5;color:#6637a0}
.tour-tabs .icon{width:15px;height:15px}
.tour-detail{min-height:96px}
.tour-detail h3{font-size:19px;margin-bottom:9px}
.tour-detail p{font-size:13px;line-height:1.8;max-width:390px}
.tour-copy>.text-link{font-size:13px;margin-top:22px}
.tour-window{background:#fff;border:1px solid #e2d7ee;border-radius:18px;box-shadow:0 23px 70px #4c25681c;overflow:hidden}
.tour-bar{height:43px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #eee8f5;padding:0 18px;background:#fcfaff}
.tour-bar img{width:22px;height:20px;object-fit:contain}
.tour-bar>span{font-size:10px;color:#807087}
.tour-bar>b{font-size:8px;letter-spacing:.04em;font-weight:500;border:1px solid #e9dfef;border-radius:5px;padding:3px 6px;color:#8b7c98}
.tour-screen{display:grid;grid-template-columns:48px 1fr;min-height:322px}
.tour-rail{background:linear-gradient(#2c1949,#1c102e);padding:18px 13px;display:flex;flex-direction:column;gap:21px;color:#b29acf}
.tour-rail .icon{width:18px;height:18px}
.tour-main{background:#faf8fc;padding:25px}
.tour-main>small{font-size:10px;color:#8b7d98}
.tour-main>h3{font-size:23px;margin:7px 0 20px}
.tour-project{display:grid;grid-template-columns:115px 1fr;background:white;border:1px solid #e8deef;border-radius:12px;overflow:hidden;min-height:120px}
.tour-project>img{width:115px;height:100%;object-fit:cover}
.tour-project>div{padding:15px}
.tour-project b{display:block;font-size:12px;margin:4px 0}
.tour-project small{display:block;font-size:9px;color:#8b7e99}
.tour-project .badge{font-size:8px;padding:4px 6px}
.tour-edit-link{display:inline-flex;align-items:center;gap:5px;padding:6px 9px;background:#eee4fa;border-radius:6px;font-size:8px;color:#69429b;margin-top:11px}
.tour-mini-row{margin-top:14px;display:flex;gap:10px;align-items:center;font-size:9px;color:#756389}
.tour-mini-row .icon{width:14px;height:14px;color:#8c56c2}
.tour-record{display:flex;gap:13px;align-items:center;background:white;padding:15px;border:1px solid #e9e0f0;border-radius:10px;margin:10px 0}
.tour-record>.icon{color:#9464c4;background:#f3ebfc;padding:7px;box-sizing:content-box;border-radius:9px;width:18px;height:18px}
.tour-record>div{flex:1;min-width:0}
.tour-record b{display:block;font-size:11px}
.tour-record small{display:block;font-size:9px;color:#887591;margin-top:3px}
.tour-record>.badge{font-size:8px}
.tour-foot{text-align:center;font-size:10px;color:#8c7b99;margin-top:14px}
@media(min-width:1400px){.hero{padding:105px 0 95px}}
@media(max-width:1150px){.nav-row{gap:30px}.nav{gap:17px}.nav-account{gap:16px}.brand img{width:148px;height:40px}.tour-layout{gap:35px}.tour-copy h2{font-size:36px}.benefit-grid article{padding:24px 19px}.floating-editor b{font-size:11px}.template-meta{flex-wrap:wrap}.hero-checks{gap:10px}.enterprise-art{padding:32px}.enterprise-monogram{width:180px}}
@media(max-width:900px){.hero{padding:60px 0}.hero-grid{grid-template-columns:1fr;gap:36px}.hero-stage{max-width:600px;width:100%;margin:auto}.hero-copy>p{max-width:560px}.hero-copy h1{font-size:56px}.tour-layout{grid-template-columns:1fr;gap:38px}.tour-copy h2{font-size:38px}.tour-detail{min-height:70px}.tour-visual{max-width:620px;width:100%;margin:auto}.benefit-grid{grid-template-columns:repeat(2,1fr)}.enterprise-art{min-height:430px}.enterprise-monogram{width:180px;bottom:42px}.auth-monogram{width:200px}}
@media(max-width:640px){.brand img{width:145px;height:39px}.nav-row{height:69px}.announcement{font-size:10px;line-height:1.5;padding:7px 10px;gap:2px}.hero{padding:41px 0 34px}.hero-grid{gap:22px}.hero-copy h1{font-size:43px;line-height:1.11;letter-spacing:-.052em}.hero-pill{font-size:10px;margin-bottom:20px;padding:5px 10px}.hero-copy>p{font-size:14px;line-height:1.8}.hero-checks{font-size:10px;gap:8px 15px;margin:21px 0 24px}.hero-stage{padding:37px 3px 68px}.hero-browser{border-width:3px;border-radius:12px}.stage-caption{font-size:7px;margin-left:7px;margin-bottom:12px}.floating-note{top:23px;right:-3px;padding:10px;gap:8px;max-width:190px}.floating-note b{font-size:8px}.floating-note small{font-size:7px}.floating-note>span{width:25px;height:25px}.floating-editor{padding:14px 13px;bottom:24px;left:24px;right:4px;gap:10px}.floating-editor>span{width:44px;height:35px}.floating-editor b{font-size:10px}.floating-editor small{font-size:7px}.floating-editor>span img{width:37px}.platform-strip .container>div{font-size:10px;gap:8px}.benefit-grid{gap:12px}.benefit-grid article{padding:20px 16px}.benefit-grid h3{font-size:17px}.benefit-grid p{font-size:12px}.benefit-grid .feature-icon{margin-bottom:19px}.template-meta{flex-wrap:nowrap}.template-meta .btn{font-size:10px}.enterprise-art{padding:31px;min-height:400px}.enterprise-art h3{font-size:32px}.enterprise-monogram{width:165px;bottom:37px;right:15px}.closing{padding:53px 0}.closing h2{font-size:31px}.sidebar .brand img{width:162px}.welcome-banner{padding:25px;gap:22px}.welcome-banner h2{font-size:23px}.welcome-banner p{font-size:12px}.welcome-banner .btn{align-self:flex-start}.stat-card{padding:16px}.stat-card .icon{padding:5px;width:14px;height:14px}.stat-card>div{font-size:10px;gap:6px}.stat-card>small{font-size:9px}.editor-topbar .brand img{width:100px;height:28px}.auth-visual .brand img{width:162px;height:43px}.auth-monogram{width:165px;height:100px;bottom:2px}.tour-copy h2{font-size:31px}.tour-copy>p{font-size:14px}.tour-tabs{gap:6px}.tour-tabs button{padding:8px 10px;font-size:11px}.tour-screen{grid-template-columns:36px 1fr;min-height:300px}.tour-rail{padding:19px 9px;gap:21px}.tour-rail .icon{width:16px;height:16px}.tour-main{padding:20px 16px}.tour-main>h3{font-size:22px}.tour-project{grid-template-columns:89px 1fr;min-height:126px}.tour-project>img{width:89px}.tour-project>div{padding:13px 11px}.tour-record{gap:9px;padding:12px}.tour-record>.icon{padding:5px;width:16px}.tour-record>.badge{font-size:7px}.tour-detail{min-height:106px}}
@media(max-width:380px){.benefit-grid{grid-template-columns:1fr}.hero-copy h1{font-size:39px}.hero-checks{flex-direction:column}.tour-tabs button{font-size:10px;padding:8px}.tour-main{padding:18px 11px}.template-meta{flex-wrap:wrap}.palette-choice{font-size:10px}}
@media(prefers-reduced-motion:reduce){.benefit-grid article:hover{transform:none}}