:root{--bg:#faf8f4;--card:#fff;--ink:#121318;--txt:#2f323a;--mut:#666a75;--line:#e8e3da;--soft:#f2eee6;--acc:#ff5a36;--acc-d:#e3401d;--blue:#3557ff;--lime:#d4f55c;--hf:'Archivo',system-ui,sans-serif;--bf:'Manrope',system-ui,sans-serif;--r:22px}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:120px}html,body{overflow-x:clip}
body{font-family:var(--bf);background:var(--bg);color:var(--txt);line-height:1.7;font-size:16.5px;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:var(--blue)}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:6px}
.wrap{width:min(1160px,92%);margin:0 auto}
.adbar{background:var(--ink);color:#c9cbd2;font-size:.76rem;text-align:center;padding:.5rem 1rem;letter-spacing:.02em}
.adbar b{display:inline-block;background:var(--acc);color:#fff;font-weight:800;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;padding:.16rem .55rem;border-radius:5px;margin-right:.5rem}
.adbar a{color:#fff}
.top{position:sticky;top:0;z-index:50;background:rgba(250,248,244,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:64px}
.logo{display:flex;align-items:center;gap:.55rem;text-decoration:none;color:var(--ink);font:800 1.22rem/1 var(--hf);letter-spacing:-.02em;font-stretch:112%}
.logo i{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--ink);color:var(--acc);font-style:normal;font-weight:900}
.logo small{font:800 .6rem var(--bf);letter-spacing:.16em;background:var(--lime);color:var(--ink);padding:.2rem .45rem;border-radius:5px;margin-left:.15rem}
.top nav{display:flex;gap:1.4rem;font-weight:700;font-size:.88rem}
.top nav a{color:var(--txt);text-decoration:none}.top nav a:hover{color:var(--acc)}
.prog{position:absolute;left:0;bottom:-1px;height:3px;width:0;background:linear-gradient(90deg,var(--acc),var(--blue))}
.hero{position:relative;overflow:hidden;padding:64px 0 56px}
.hero::before{content:"";position:absolute;inset:-30% -10% auto auto;width:720px;height:720px;border-radius:50%;background:radial-gradient(circle,rgba(255,90,54,.18),transparent 62%);z-index:-1}
.hero::after{content:"";position:absolute;left:-200px;bottom:-260px;width:620px;height:620px;border-radius:50%;background:radial-gradient(circle,rgba(53,87,255,.12),transparent 62%);z-index:-1}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center}
.kick{display:inline-flex;align-items:center;gap:.5rem;font:800 .74rem var(--bf);letter-spacing:.16em;text-transform:uppercase;color:var(--acc)}
.kick::before{content:"";width:22px;height:3px;border-radius:3px;background:var(--acc)}
h1{font:900 clamp(2.4rem,5.4vw,4.3rem)/.98 var(--hf);letter-spacing:-.035em;color:var(--ink);font-stretch:108%;margin:1rem 0 1.2rem}
h1 em{font-style:normal;background:linear-gradient(transparent 62%,var(--lime) 62%,var(--lime) 92%,transparent 92%)}
.dek{font-size:1.14rem;max-width:560px;color:var(--txt)}
.by{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.2rem;margin-top:1.6rem;font-size:.84rem;color:var(--mut)}
.by b{color:var(--ink)}
.by span{display:inline-flex;align-items:center;gap:.4rem}
.by span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--acc)}
.by span:first-child::before{display:none}
.collage{position:relative;height:440px}
.collage figure{position:absolute;width:52%;border-radius:20px;overflow:hidden;background:#fff;border:6px solid #fff;box-shadow:0 30px 60px -28px rgba(18,19,24,.45);transition:transform .4s}
.collage figure:hover{transform:rotate(0) scale(1.03)!important;z-index:5}
.collage img{width:100%;aspect-ratio:1;object-fit:cover}
.collage b{position:absolute;top:10px;left:10px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:#fff;font:800 .82rem var(--hf)}
.collage .c1{left:0;top:10px;transform:rotate(-6deg)}
.collage .c2{right:0;top:0;transform:rotate(5deg);width:46%}
.collage .c3{left:12%;bottom:0;transform:rotate(4deg);width:44%}
.collage .c4{right:4%;bottom:20px;transform:rotate(-4deg);width:46%}
.chips{position:sticky;top:64px;z-index:40;background:rgba(250,248,244,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.chips .wrap{display:flex;gap:.5rem;overflow-x:auto;padding:.7rem 0;scrollbar-width:none}
.chips .wrap::-webkit-scrollbar{display:none}
.chips a{flex:none;display:inline-flex;align-items:center;gap:.45rem;text-decoration:none;color:var(--txt);font-weight:700;font-size:.82rem;padding:.42rem .85rem .42rem .45rem;border-radius:999px;background:#fff;border:1px solid var(--line);transition:.2s}
.chips a i{font-style:normal;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--soft);font:800 .7rem var(--hf);color:var(--ink)}
.chips a:hover,.chips a.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.chips a.on i,.chips a:hover i{background:var(--acc);color:#fff}
.intro{padding:52px 0 20px}
.intro .wrap{max-width:780px}
.intro p{font-size:1.08rem;margin-bottom:1rem}
.glance{margin:2rem 0 0;background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.glance h2{font:800 1.05rem var(--hf);letter-spacing:-.01em;color:var(--ink);padding:1rem 1.3rem;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}
.glance h2 small{font:700 .72rem var(--bf);color:var(--mut);letter-spacing:.08em;text-transform:uppercase}
.glance table{width:100%;border-collapse:collapse;font-size:.92rem}
.glance td{padding:.8rem 1.3rem;border-bottom:1px solid var(--line);vertical-align:middle}
.glance tr:last-child td{border-bottom:0}
.glance td:first-child{width:52px;font:900 1rem var(--hf);color:var(--acc)}
.glance td b{color:var(--ink);display:block;line-height:1.3}
.glance td span{font-size:.8rem;color:var(--mut)}
.glance td:last-child{text-align:right;white-space:nowrap}
.glance td:last-child a{font-weight:800;font-size:.84rem;text-decoration:none;color:var(--blue)}
.list{padding:30px 0 20px}
.item{position:relative;display:grid;grid-template-columns:1fr 1.08fr;gap:2.6rem;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:28px;padding:2rem;margin-bottom:2rem;box-shadow:0 2px 0 rgba(18,19,24,.03)}
.item:nth-child(even){grid-template-columns:1.08fr 1fr}
.item:nth-child(even) .pic{order:2}
.num{position:absolute;top:-28px;right:26px;font:900 5.4rem/1 var(--hf);color:transparent;-webkit-text-stroke:2px var(--ink);letter-spacing:-.04em;opacity:.12;pointer-events:none}
.pic{position:relative;border-radius:20px;overflow:hidden;background:var(--soft)}
.pic img{width:100%;aspect-ratio:4/3.3;object-fit:cover;transition:transform .6s}
.item:hover .pic img{transform:scale(1.035)}
.pic .badge{position:absolute;left:14px;top:14px;display:flex;align-items:center;gap:.5rem;background:var(--ink);color:#fff;border-radius:999px;padding:.35rem .8rem .35rem .4rem;font:800 .78rem var(--bf)}
.pic .badge i{font-style:normal;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--acc);font:900 .78rem var(--hf)}
.pic figcaption{position:absolute;right:10px;bottom:10px;font-size:.64rem;color:#fff;background:rgba(18,19,24,.55);padding:.18rem .5rem;border-radius:6px}
.cat{display:inline-block;font:800 .7rem var(--bf);letter-spacing:.14em;text-transform:uppercase;color:var(--blue);background:rgba(53,87,255,.08);padding:.3rem .65rem;border-radius:6px}
.item h2{font:900 clamp(1.6rem,3vw,2.15rem)/1.06 var(--hf);letter-spacing:-.03em;color:var(--ink);margin:.75rem 0 .35rem;font-stretch:104%}
.item .line{font-weight:700;color:var(--mut);margin-bottom:.9rem}
.item p.sum{font-size:1rem;margin-bottom:1rem}
.why{list-style:none;display:grid;gap:.5rem;margin:0 0 1rem}
.why li{display:flex;gap:.6rem;align-items:flex-start;font-size:.95rem;font-weight:600;color:var(--ink);line-height:1.45}
.why li::before{content:"";flex:none;width:20px;height:20px;margin-top:.05rem;border-radius:6px;background:var(--lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23121318' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-8'/%3E%3C/svg%3E") center/14px no-repeat}
.gtk{display:flex;gap:.6rem;font-size:.86rem;color:var(--mut);background:var(--soft);border-radius:12px;padding:.75rem .9rem;margin-bottom:1.2rem;line-height:1.55}
.gtk b{color:var(--ink);white-space:nowrap}
.buy{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;background:var(--acc);color:#fff;text-decoration:none;font:800 1rem var(--bf);padding:1rem 1.5rem;border-radius:14px;box-shadow:0 12px 24px -10px rgba(255,90,54,.7);transition:.2s}
.btn:hover{background:var(--acc-d);transform:translateY(-2px)}
.btn svg{width:18px;height:18px;transition:transform .2s}.btn:hover svg{transform:translateX(3px)}
.buy small{font-size:.76rem;color:var(--mut)}
.how{padding:30px 0 10px}
.how .box{background:var(--ink);color:#c9cbd2;border-radius:28px;padding:2.6rem;display:grid;grid-template-columns:.9fr 1.1fr;gap:2.4rem;position:relative;overflow:hidden}
.how .box::after{content:"";position:absolute;right:-90px;top:-90px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(212,245,92,.25),transparent 65%)}
.how h2{font:900 clamp(1.7rem,3vw,2.3rem)/1.05 var(--hf);color:#fff;letter-spacing:-.03em}
.how h2 em{font-style:normal;color:var(--lime)}
.how ul{list-style:none;display:grid;gap:1rem;position:relative;z-index:1}
.how li{display:flex;gap:.9rem}
.how li b{flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.08);color:var(--lime);font:900 .85rem var(--hf)}
.how li span{font-size:.95rem}.how li strong{color:#fff;display:block}
.faq{padding:50px 0 10px}
.faq .wrap{max-width:820px}
.faq h2{font:900 clamp(1.7rem,3vw,2.3rem)/1.05 var(--hf);letter-spacing:-.03em;color:var(--ink);margin-bottom:1.2rem}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:16px;margin-bottom:.7rem}
.faq summary{list-style:none;cursor:pointer;padding:1rem 3rem 1rem 1.2rem;font-weight:800;color:var(--ink);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:1rem;top:50%;transform:translateY(-50%);width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:var(--soft);font-weight:800}
.faq details[open] summary::after{content:"\2013";background:var(--acc);color:#fff}
.faq details p{padding:0 1.2rem 1.1rem;font-size:.95rem}
footer{margin-top:60px;background:var(--ink);color:#9a9ca6;padding:44px 0 34px;font-size:.84rem}
footer .logo{color:#fff}
footer nav{display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;margin:1.2rem 0}
footer nav a{color:#fff;text-decoration:none;font-weight:700}footer nav a:hover{color:var(--acc)}
footer p{margin-bottom:.8rem;line-height:1.65;max-width:900px}
footer p b{color:#fff}
.legal{max-width:780px;margin:0 auto;padding:50px 0 10px}
.legal h1{font-size:clamp(2.2rem,5vw,3rem);margin:.4rem 0 .4rem}
.legal .upd{font-size:.84rem;color:var(--mut);margin-bottom:1.6rem}
.legal h2{font:800 1.3rem var(--hf);color:var(--ink);margin:1.8rem 0 .4rem}
.legal p{margin-bottom:.8rem}
.back{display:inline-block;margin-top:1.2rem;font-weight:800;text-decoration:none}
@media (max-width:960px){.hero .wrap{grid-template-columns:1fr}.collage{height:360px;max-width:520px;width:100%;margin:0 auto}.item,.item:nth-child(even){grid-template-columns:1fr;gap:1.4rem;padding:1.3rem}.item:nth-child(even) .pic{order:0}.how .box{grid-template-columns:1fr;padding:2rem}.top nav{display:none}}
@media (max-width:600px){body{font-size:16px}.hero{padding:38px 0 34px}.collage{height:280px}.collage figure{border-width:4px}.num{font-size:4rem;top:-20px;right:16px}.glance td{padding:.7rem .9rem}.glance td:nth-child(3){display:none}.btn{width:100%}.buy small{width:100%;text-align:center}.item{border-radius:22px}.how .box{padding:1.6rem;border-radius:22px}.adbar{font-size:.7rem}.gtk{flex-direction:column;gap:.2rem}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}html{scroll-behavior:auto}}