@font-face{font-family:CaptaleSystem;src:local('Segoe UI')}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#09080d;color:#f8f6fc;font-family:CaptaleSystem,Arial,sans-serif;line-height:1.55;--accent:#b59aff}a{color:inherit;text-decoration:none}button,input{font:inherit}button,a,input{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #ccafff;outline-offset:5px}header{height:86px;max-width:1440px;margin:auto;padding:0 6%;display:flex;align-items:center;gap:36px;border-bottom:1px solid #ffffff0d}.logo{width:136px;background:#faf8ff;padding:6px 10px;border-radius:11px}.logo img{width:100%;display:block}nav{margin-left:auto;display:flex;gap:30px;font-size:12px;color:#c8c3d0}.cta{display:inline-flex;justify-content:center;align-items:center;gap:10px;padding:14px 24px;background:#ad87fa;color:#140a25;border:0;border-radius:11px;font-size:13px;font-weight:750;box-shadow:0 5px 30px #9058e51c}.cta.secondary{background:#ffffff08;color:#ece4fa;border:1px solid #ffffff24;box-shadow:none}.cta:hover{filter:brightness(1.12)}.subtle{font-size:12px;color:#9e97ac}.kicker{font-size:10px;font-weight:750;letter-spacing:2.5px;color:#b69bf3;text-transform:uppercase}h1{font-size:clamp(46px,5.5vw,82px);line-height:1.04;letter-spacing:-3.8px;margin:22px 0;font-weight:750}h1 em{font-style:normal;color:#b59aff}h2{font-size:40px;letter-spacing:-1.7px;line-height:1.1;margin:14px 0}p{color:#aaa3b6;font-size:16px;max-width:500px}.actions{display:flex;gap:12px;margin:28px 0 18px;flex-wrap:wrap}.pill{display:inline-flex;gap:8px;align-items:center;padding:6px 12px;border:1px solid #ffffff19;border-radius:30px;background:#ffffff04;font-size:10px;color:#d2c2ed}.pill i{width:5px;height:5px;border-radius:50%;background:#b59aff}.hero{position:relative}.a .hero{padding:50px 6% 30px;text-align:center;background:radial-gradient(ellipse at 50% 0,#41236744,transparent 65%)}.a h1{font-size:clamp(50px,5vw,74px);margin:16px 0}.a .hero>p{margin:0 auto}.a .actions{justify-content:center;margin:23px 0 14px}.a .gallery{display:grid;grid-template-columns:.85fr 1.1fr .9fr 1.1fr .85fr;gap:15px;align-items:center;margin:38px auto 0;max-width:1360px}.tile{position:relative;border-radius:17px;overflow:hidden;background:#22182d;border:1px solid #ffffff16}.tile .art{width:100%;height:100%;background-repeat:no-repeat}.atlas{background-image:url('assets/captale-style-atlas.webp');background-size:400% 400%;background-position:33.333% 33.333%}.anime{background-position:33.333% 0}.comic{background-position:66.666% 33.333%}.game3d{background-position:0 100%}.paint{background-position:100% 33.333%}.bw{background-position:66.666% 0}.tile span{position:absolute;bottom:12px;left:12px;right:12px;font-size:11px;font-weight:650;text-shadow:0 1px 5px #000;z-index:2}.tile:after{content:'';position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#0009);pointer-events:none}.a .tile{height:230px}.a .tile:nth-child(2),.a .tile:nth-child(4){height:280px}.a .tile:nth-child(3){height:310px}.scene{background:url('assets/captale-heroArt.webp') center/cover}.moments{background:url('assets/captale-momentsArt.webp') 70% 50%/cover}.section{padding:65px 7%;max-width:1320px;margin:auto}.strip{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;padding:25px 20px;color:#bdb3cd;font-size:11px;border-block:1px solid #ffffff0d}.strip b{color:#b59aff}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px}.section-head p{max-width:340px;font-size:13px}.example-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:25px}.example{background:#15111d;border:1px solid #ffffff12;border-radius:20px;overflow:hidden}.example .art{height:220px}.example .copy{padding:18px 22px}.example h3{font-size:17px;margin:0}.example p{font-size:12px;margin:8px 0 0}.preview-note{font-size:10px;color:#8d859b;text-align:center;margin:15px 0}.b header{background:#0b0910}.b .hero{max-width:1440px;margin:auto;padding:64px 8% 75px;display:grid;grid-template-columns:1fr 1fr;gap:45px;align-items:center;background:radial-gradient(ellipse at 80% 50%,#4b28713b,transparent 60%)}.b h1{font-size:clamp(48px,5.8vw,82px)}.phone-stage{position:relative;display:flex;justify-content:center;align-items:center;min-height:560px}.phone{position:relative;width:250px;border:6px solid #29222e;border-radius:35px;background:#f2edff;box-shadow:0 40px 95px #0008;overflow:hidden;transform:rotate(4deg);z-index:2}.phone img{display:block;width:100%}.phone-stage>.tile{position:absolute;width:175px;height:215px;left:-8px;top:28px;transform:rotate(-10deg)}.phone-stage>.tile.second{left:auto;right:-3px;top:auto;bottom:40px;transform:rotate(10deg);z-index:3;width:150px;height:190px}.phone-tag{position:absolute;bottom:4px;left:0;z-index:4;padding:13px 17px;background:#21162f;border:1px solid #7b4f9d77;border-radius:12px;font-size:11px;box-shadow:0 15px 25px #0006}.b .steps{display:flex;gap:26px;flex-wrap:wrap;margin-top:35px;font-size:11px;color:#b8accb}.steps span b{display:inline-grid;place-items:center;width:23px;height:23px;border-radius:8px;background:#ad87fa20;color:#c7abff;margin-right:7px}.b .section{background:#100d17;max-width:none}.b .section-inner{max-width:1100px;margin:auto}.c header{position:relative;z-index:3}.c .hero{display:grid;grid-template-columns:1.05fr 1fr;min-height:650px;align-items:stretch}.transform-panel{position:relative;min-height:650px;background:#1a1720;overflow:hidden}.transform-photo{position:absolute;inset:0;background-size:400% 400%;background-position:33.333% 33.333%;background-image:url('assets/captale-style-atlas.webp')}.transform-result{position:absolute;inset:0;background-image:url('assets/captale-style-atlas.webp');background-size:400% 400%;background-position:33.333% 0;clip-path:inset(0 0 0 50%)}.divider{position:absolute;top:0;bottom:0;left:50%;width:2px;background:#fff9;pointer-events:none}.divider:after{content:'↔';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%;width:40px;height:40px;display:grid;place-items:center;background:white;color:#1c102c;box-shadow:0 5px 20px #0005}.compare-labels{position:absolute;top:25px;left:25px;right:25px;display:flex;justify-content:space-between;pointer-events:none}.compare-labels span{background:#14101999;border:1px solid #fff2;backdrop-filter:blur(10px);border-radius:25px;padding:6px 13px;font-size:10px}.transform-panel input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;z-index:2}.transform-panel:focus-within{outline:3px solid #b59aff;outline-offset:-3px}.transform-panel .caption{position:absolute;bottom:20px;left:25px;right:25px;z-index:3;font-size:10px;color:#eee;text-shadow:0 1px 5px #000;pointer-events:none}.c .hero-copy{padding:60px 10% 40px 12%;align-self:center}.c h1{font-size:clamp(45px,5vw,72px)}.style-picker{display:flex;gap:10px;margin:22px 0}.style-option{padding:0;background:#15101c;border:1px solid #fff2;border-radius:10px;overflow:hidden;width:76px;color:white}.style-option[aria-pressed=true]{border:2px solid #b59aff}.style-option .art{height:56px}.style-option small{display:block;font-size:9px;padding:6px}.c .hero-copy p{font-size:15px}.cta-section{text-align:center;padding:60px 20px;background:linear-gradient(150deg,#20132f,#100b19);margin:25px auto 0}.cta-section p{margin:15px auto 25px}.cta-section h2{font-size:37px}footer{padding:30px 6%;display:flex;gap:25px;align-items:center;font-size:10px;color:#9a90aa;border-top:1px solid #ffffff10}footer .footer-links{display:flex;gap:20px;margin-left:auto}.mock-badge{background:#bda8ee14;color:#bca9d7;text-align:center;font-size:9px;letter-spacing:.5px;padding:6px}.simplenav{margin:0;display:block;font-family:inherit;--simplenav-accent:#b59aff}.simplenav__brand img{background:#f8f5ff;border-radius:5px;padding:3px}.simplenav__shell{background:#120d1c99}.simplenav[data-expanded=true] .simplenav__shell{background:#171020}dialog{max-width:400px;border:1px solid #654787;border-radius:20px;background:#16101e;color:#eee;padding:30px}dialog::backdrop{background:#000b}dialog h2{font-size:26px}dialog p{font-size:14px}dialog button{margin-top:15px}#detail[hidden]{display:none}
@media(max-width:760px){header{height:72px;padding:0 22px;gap:15px}header nav{display:none}.logo{width:120px}header>.cta{margin-left:auto;padding:10px 15px;font-size:11px;border-radius:9px}h1{letter-spacing:-2px}.a .hero{padding:32px 20px 20px}.a h1{font-size:46px}.a .hero>p{font-size:14px;max-width:320px}.a .gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:28px}.a .tile{height:135px!important;border-radius:11px}.a .tile:nth-child(3){height:170px!important}.a .tile:nth-child(2){height:150px!important}.a .tile:nth-child(n+4){display:none}.a .tile span{font-size:8px;left:8px;bottom:8px}.a .actions{gap:9px}.a .actions .cta{font-size:11px;padding:12px 16px}.section{padding:40px 23px}.section-head{display:block}.section-head h2{font-size:30px}.section-head>p{max-width:none}.example-grid{grid-template-columns:1fr;gap:16px}.example .art{height:230px}.strip{gap:13px;padding:20px;font-size:9px}.b .hero{padding:35px 25px;grid-template-columns:1fr;gap:15px}.b h1{font-size:48px;margin:17px 0}.b .hero p{font-size:14px}.phone-stage{min-height:420px;margin:0 18px}.phone{width:180px;border-radius:26px;border-width:5px}.phone-stage>.tile{width:115px;height:160px;left:-16px;top:30px}.phone-stage>.tile.second{width:110px;height:140px;right:-15px;bottom:15px}.phone-tag{font-size:8px;padding:9px;bottom:0}.b .steps{gap:12px;margin-top:20px;font-size:9px}.b .steps span b{width:19px;height:19px;margin-right:4px}.c .hero{display:flex;flex-direction:column-reverse}.c .hero-copy{padding:30px 24px 24px}.c h1{font-size:44px;margin:16px 0}.c .hero-copy p{font-size:13px}.c .style-picker{margin:18px 0}.transform-panel{min-height:350px;aspect-ratio:1/1}.c .hero-copy .actions{margin:18px 0 12px}.style-option{width:64px}.style-option .art{height:43px}.style-option small{padding:4px}.cta-section h2{font-size:30px}footer{flex-wrap:wrap;padding:25px}.footer-links{margin:0!important;flex-wrap:wrap}.mock-badge{font-size:8px}.preview-note{font-size:9px}.kicker{font-size:9px;letter-spacing:2px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
:root{--simplenav-accent:#b59aff}
