*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:Inter,Segoe UI,Arial,sans-serif;background:#030913;color:#f7f7ff;overflow-x:hidden;background-image:radial-gradient(circle at 70% 0%,rgba(72,54,174,.22),transparent 34%),radial-gradient(circle at 20% 20%,rgba(0,119,255,.13),transparent 28%)}a{text-decoration:none;color:inherit}img{display:block;max-width:100%}:root{--page:94vw;--max:3540px;--header:122px;--panel:rgba(10,20,36,.72);--panel2:rgba(13,26,45,.82);--line:rgba(142,166,205,.18);--muted:#aab4c8;--blue:#2388ff;--purple:#7c3cff;--pink:#ff3da6;--shadow:0 28px 100px rgba(0,0,0,.34)}.section-wide{width:var(--page);max-width:var(--max);margin-inline:auto}.site-header{position:sticky;top:0;height:var(--header);z-index:50;background:rgba(3,9,19,.82);backdrop-filter:blur(22px);border-bottom:1px solid var(--line)}.nav-shell{height:100%;display:flex;align-items:center;justify-content:space-between;gap:42px;width:var(--page);max-width:var(--max);margin:auto}.brand{display:flex;align-items:center;gap:15px}.brand-mark{width:48px;height:48px;border-radius:11px;background:linear-gradient(135deg,#ffb42b,#ff6a00);display:grid;place-items:center;color:#0b0c10;font-weight:1000;font-size:24px;box-shadow:0 0 0 1px rgba(255,255,255,.16) inset}.brand-text{font-size:23px;font-weight:900;letter-spacing:-.3px}.main-nav{display:flex;align-items:center;gap:48px;font-size:16px;font-weight:750;color:#e9ecff}.main-nav a{opacity:.92}.main-nav a:hover{color:#8c6dff}.nav-actions{display:flex;align-items:center;gap:18px}.language-select{height:54px;min-width:178px;border:1px solid var(--line);border-radius:10px;background:#07101d;color:#fff;padding:0 18px;font-weight:800}.top-download{height:54px;padding:0 26px;border-radius:10px;display:inline-flex;align-items:center;font-weight:900;background:linear-gradient(135deg,var(--purple),var(--blue));box-shadow:0 12px 34px rgba(71,95,255,.28)}.hero{min-height:700px;display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center;padding:52px 0 24px}.eyebrow{font-size:17px;font-weight:1000;letter-spacing:.16em;text-transform:uppercase;color:#8b5cff;margin-bottom:22px}.hero h1{font-size:clamp(58px,4.1vw,108px);line-height:.98;letter-spacing:-2.5px;max-width:980px}.hero h1 span{display:block;background:linear-gradient(90deg,#8a3ffc,#2f8cff 70%);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-subtitle{font-size:24px;line-height:1.45;color:#d5d9eb;max-width:940px;margin-top:28px}.hero-pills{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}.hero-pills span{display:flex;align-items:center;gap:10px;padding:13px 18px;border:1px solid var(--line);border-radius:10px;background:rgba(9,20,38,.64);color:#f4f6ff}.hero-pills i{font-style:normal;color:#4d91ff}.hero-actions{display:flex;gap:24px;margin-top:46px}.hero-actions.center{justify-content:center}.btn{height:74px;display:inline-flex;align-items:center;justify-content:center;gap:14px;border-radius:12px;padding:0 42px;font-size:19px;font-weight:1000;border:1px solid var(--line)}.btn svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}.btn.primary{background:linear-gradient(135deg,var(--purple),var(--blue));box-shadow:0 20px 48px rgba(61,103,255,.34)}.btn.secondary{background:rgba(5,12,24,.7);border-color:rgba(255,255,255,.18)}.trial-note{margin-top:22px;color:#bac1d4;font-size:17px}.app-frame{border:1px solid rgba(139,154,190,.24);background:linear-gradient(180deg,rgba(18,24,36,.9),rgba(5,10,18,.9));border-radius:24px;padding:14px;box-shadow:var(--shadow);max-width:1320px;justify-self:end}.app-frame img{width:100%;border-radius:15px}.gallery-showcase{position:relative;margin-top:0;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,rgba(8,20,37,.82),rgba(5,13,25,.78));box-shadow:var(--shadow);padding:22px 96px 34px}.gallery-title{display:flex;align-items:center;justify-content:center;gap:18px;text-align:center;margin-bottom:16px}.title-icon{width:32px;height:32px;display:grid;place-items:center;color:#8a4fff;border:1px solid rgba(139,92,246,.5);border-radius:6px;font-weight:1000}.gallery-title h2{font-size:26px;line-height:1.05}.gallery-title p{color:#c3cadb;margin-top:5px;font-size:15px}.gallery-title strong{display:inline-block;margin-top:8px;font-size:14px;color:#8fb8ff;text-transform:uppercase;letter-spacing:.12em}.translation-gallery{display:flex;gap:34px;overflow:hidden;scroll-behavior:smooth;padding:4px 0 18px}.gallery-card{flex:0 0 clamp(680px,40vw,1060px);height:560px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:#111827;overflow:hidden;position:relative;cursor:pointer;box-shadow:0 12px 34px rgba(0,0,0,.28);padding:0}.gallery-card img{width:100%;height:100%;object-fit:contain;filter:contrast(1.06);background:#050914}.gallery-card:hover,.gallery-card.active{outline:3px solid var(--purple);box-shadow:0 0 28px rgba(124,60,255,.45)}.gallery-card span{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(transparent,rgba(0,0,0,.88));padding:40px 12px 10px;text-align:left;font-size:15px;font-weight:900;color:white}.gallery-empty,.gallery-loading{width:100%;padding:48px 24px;text-align:center;border:1px dashed rgba(139,92,246,.4);border-radius:14px;color:#b7c1d8;background:rgba(255,255,255,.035)}.gallery-arrow{position:absolute;top:58%;transform:translateY(-50%);width:58px;height:58px;border:0;border-radius:50%;background:rgba(23,32,52,.92);color:#fff;font-size:42px;z-index:3;cursor:pointer}.gallery-arrow.left{left:28px}.gallery-arrow.right{right:28px}.gallery-dots{display:flex;justify-content:center;gap:12px;margin-top:8px}.gallery-dots button{width:12px;height:12px;border-radius:50%;border:0;background:rgba(255,255,255,.18)}.gallery-dots button.active{background:#784bff}.feature-cards{display:grid;grid-template-columns:repeat(6,1fr);gap:24px;margin-top:24px}.feature-cards article{border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:32px 28px;min-height:185px}.feature-icon{width:62px;height:62px;margin-bottom:18px}.feature-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.purple{color:#8b5cff}.blue{color:#1595ff}.pink{color:#ff3da6}.feature-cards h3{font-size:21px;margin-bottom:11px}.feature-cards p{font-size:16px;color:#c2cadd;line-height:1.5}.accordion-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:24px}.info-panel{border:1px solid var(--line);border-radius:16px;background:var(--panel);overflow:hidden}.info-panel summary{list-style:none;cursor:pointer;min-height:86px;padding:22px 28px;display:flex;align-items:center;justify-content:space-between;gap:14px}.info-panel summary::-webkit-details-marker{display:none}.summary-left{display:flex;align-items:center;gap:20px}.summary-left b{display:block;font-size:21px}.summary-left small{display:block;margin-top:6px;color:#aab4c8;font-size:14px}.mini-icon{width:44px;min-width:44px;height:44px;display:grid;place-items:center;color:#18a0ff;font-style:normal;font-weight:1000;font-size:18px}.info-panel em{font-style:normal;font-size:28px}.panel-body{padding:0 28px 28px;color:#cbd3e5}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:15px}th,td{border-bottom:1px solid var(--line);padding:12px;text-align:left}th{color:#fff}.small-note{font-size:14px;color:#9eabc2;margin-top:16px}.hardware-list{display:grid;gap:10px}.hardware-list div{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:10px 0}.steps p,.faq-list p{padding:9px 0;line-height:1.5}.stats-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:0;border:1px solid var(--line);border-radius:16px;background:var(--panel);margin-top:24px;overflow:hidden}.stats-strip div{padding:32px 38px;border-right:1px solid var(--line)}.stats-strip div:last-child{border-right:0}.stats-strip b{font-size:21px;display:block}.stats-strip span{display:block;color:#b9c2d4;margin-top:6px;font-size:16px;line-height:1.35}.cta-panel{text-align:center;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,rgba(8,20,37,.88),rgba(5,12,24,.82));padding:70px 30px;margin-top:48px}.cta-panel h2{font-size:42px}.cta-panel p{font-size:18px;color:#c2cadb;margin-top:15px}.cta-panel small{display:block;margin-top:20px;color:#aeb7cc}.site-footer{width:var(--page);max-width:var(--max);margin:60px auto 0;padding:40px 0 55px;display:grid;grid-template-columns:1.4fr .6fr .6fr;gap:70px;color:#c6ccda;border-top:1px solid var(--line)}.footer-brand{margin-bottom:16px}.site-footer p{max-width:520px;line-height:1.45}.site-footer h4{color:#fff;margin-bottom:12px}.site-footer a:not(.brand){display:block;margin:8px 0;color:#c6ccda}.copyright{grid-column:1/-1;text-align:center;color:#828da5!important;max-width:none!important}.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.94);z-index:100;display:none;align-items:center;justify-content:center;padding:38px}.lightbox.active{display:flex}.lightbox img{max-width:92vw;max-height:90vh;object-fit:contain}.lightbox-close{position:fixed;top:22px;right:28px;background:none;border:0;color:#fff;font-size:50px;cursor:pointer}.lightbox-arrow{position:fixed;top:50%;transform:translateY(-50%);width:64px;height:86px;border:0;border-radius:18px;background:rgba(255,255,255,.1);color:white;font-size:62px;cursor:pointer}.lightbox-arrow.left{left:26px}.lightbox-arrow.right{right:26px}.lightbox-counter{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:rgba(255,255,255,.12);padding:10px 16px;border-radius:999px;color:#fff;font-weight:800}@media(min-width:2560px){:root{--header:138px}.brand-text{font-size:30px}.brand-mark{width:60px;height:60px}.main-nav{font-size:20px;gap:64px}.language-select,.top-download{height:64px;font-size:18px}.hero{min-height:980px}.gallery-card{flex-basis:860px;height:560px}.feature-cards h3{font-size:27px}.feature-cards p,.stats-strip span{font-size:20px}.summary-left b{font-size:27px}.summary-left small{font-size:18px}.btn{height:88px;font-size:23px}}@media(max-width:1600px){:root{--header:86px}.brand-mark{width:36px;height:36px;font-size:18px}.brand-text{font-size:18px}.main-nav{font-size:13px;gap:28px}.language-select,.top-download{height:44px}.hero{min-height:650px;gap:46px}.hero h1{font-size:clamp(52px,4.5vw,82px)}.hero-subtitle{font-size:20px}.feature-cards{grid-template-columns:repeat(6,1fr)}.feature-cards article{padding:24px 20px}.feature-cards h3{font-size:18px}.feature-cards p{font-size:14px}.accordion-grid{grid-template-columns:repeat(4,1fr)}}@media(max-width:1200px){.main-nav{display:none}.hero{grid-template-columns:1fr;min-height:auto;padding:52px 0}.app-frame{max-width:1000px}.feature-cards{grid-template-columns:repeat(3,1fr)}.accordion-grid{grid-template-columns:repeat(2,1fr)}.stats-strip{grid-template-columns:repeat(2,1fr)}.stats-strip div{border-bottom:1px solid var(--line)}}@media(max-width:768px){:root{--header:82px;--page:94vw}.site-header{height:auto;min-height:var(--header)}.nav-shell{padding:12px 0}.brand-text{font-size:15px}.nav-actions{margin-left:auto}.top-download{display:none}.hero{padding:34px 0}.hero h1{font-size:50px;letter-spacing:-2px}.hero-subtitle{font-size:18px}.hero-actions{flex-direction:column}.btn{width:100%;height:62px}.gallery-showcase{padding:22px 46px}.translation-gallery{gap:18px}.gallery-card{flex-basis:82vw;height:56vw;max-height:520px}.feature-cards,.accordion-grid,.stats-strip{grid-template-columns:1fr}.feature-cards article{min-height:unset}.site-footer{grid-template-columns:1fr}.gallery-arrow{width:42px;height:42px;font-size:32px}.gallery-arrow.left{left:8px}.gallery-arrow.right{right:8px}}@media(max-width:480px){:root{--header:116px}.nav-shell{flex-wrap:wrap;justify-content:center}.brand{width:100%;justify-content:center}.nav-actions{width:100%;justify-content:center;margin:0}.language-select{width:100%;max-width:230px}.hero h1{font-size:38px}.hero-pills span{width:100%;justify-content:center}.gallery-title h2{font-size:24px}.gallery-showcase{padding:20px 38px}.gallery-card{flex-basis:84vw;height:58vw}.stats-strip div{padding:24px}.info-panel summary{padding:20px}.summary-left b{font-size:18px}.lightbox{padding:14px}.lightbox-arrow{width:42px;height:58px;font-size:40px}.lightbox-arrow.left{left:4px}.lightbox-arrow.right{right:4px}}@media(max-width:320px){.hero h1{font-size:32px}.hero-subtitle{font-size:16px}.brand-text{font-size:13px}.gallery-card{flex-basis:84vw;height:58vw}.section-wide{width:95vw}}
/* V12: hero più compatto + screenshot app più grande + galleria a singola/doppia immagine grande */
.hero{
min-height:640px;
grid-template-columns:.82fr 1.18fr;
gap:54px;
padding:42px 0 22px;
}
.hero h1{
font-size:clamp(50px,3.55vw,92px);
letter-spacing:-2px;
max-width:860px;
}
.hero-subtitle{
font-size:21px;
max-width:820px;
margin-top:24px;
}
.app-frame{
max-width:1500px;
width:100%;
justify-self:end;
padding:12px;
}
.gallery-showcase{
padding:22px 104px 38px;
margin-top:18px;
}
.gallery-title{
margin-bottom:14px;
}
.gallery-title h2{
font-size:25px;
}
.gallery-title p{
font-size:14px;
}
.translation-gallery{
gap:46px;
overflow-x:auto;
overflow-y:hidden;
scroll-snap-type:x mandatory;
scrollbar-width:none;
padding:8px 0 22px;
}
.translation-gallery::-webkit-scrollbar{display:none;}
.gallery-card{
flex:0 0 min(1120px,82vw);
height:clamp(520px,52vw,860px);
scroll-snap-align:center;
border-radius:16px;
}
.gallery-card img{
width:100%;
height:100%;
object-fit:contain;
background:#050914;
}
.gallery-card span{
font-size:17px;
padding:52px 18px 16px;
}
.gallery-arrow{
top:56%;
width:66px;
height:66px;
font-size:48px;
}
.gallery-arrow.left{left:24px;}
.gallery-arrow.right{right:24px;}
@media(min-width:2560px){
.hero{grid-template-columns:.78fr 1.22fr;min-height:920px;}
.hero h1{font-size:clamp(70px,3.7vw,128px);}
.app-frame{max-width:1850px;}
.gallery-card{flex-basis:min(1420px,76vw);height:880px;}
}
@media(max-width:1600px){
.hero{grid-template-columns:.86fr 1.14fr;gap:38px;min-height:600px;}
.hero h1{font-size:clamp(46px,3.9vw,72px);}
.hero-subtitle{font-size:18px;}
.gallery-card{flex-basis:min(900px,80vw);height:560px;}
}
@media(max-width:1200px){
.hero{grid-template-columns:1fr;}
.app-frame{max-width:1100px;justify-self:center;}
.gallery-card{flex-basis:86vw;height:62vw;min-height:430px;}
}
@media(max-width:768px){
.gallery-showcase{padding:20px 48px 30px;}
.gallery-card{flex-basis:86vw;height:66vw;min-height:320px;}
.gallery-arrow{width:44px;height:44px;font-size:34px;}
.gallery-arrow.left{left:6px;}
.gallery-arrow.right{right:6px;}
}
@media(max-width:480px){
.hero h1{font-size:36px;}
.gallery-card{flex-basis:84vw;height:68vw;min-height:260px;}
}
/* Fix gallery messages */
.gallery-notice{flex:0 0 100%;padding:14px 18px;border:1px solid rgba(35,136,255,.35);border-radius:12px;background:rgba(35,136,255,.08);color:#c8d6ef;font-size:15px;line-height:1.45;margin-bottom:8px}
/* Final UX tweaks requested */
.language-select{
min-width:210px;
font-size:16px;
}
.gallery-showcase{
padding-top:34px;
padding-bottom:52px;
}
.gallery-title h2{
font-size:clamp(32px,1.9vw,48px);
}
.gallery-title p{
font-size:clamp(16px,1vw,22px);
}
.gallery-title strong{
font-size:clamp(15px,.9vw,20px);
}
.gallery-card{
/* roughly +30% bigger than original */
flex-basis:min(1450px,86vw);
height:clamp(680px,58vw,1040px);
}
@media(max-width:1600px){
.gallery-card{flex-basis:min(1120px,84vw);height:680px;}
}
@media(max-width:1200px){
.gallery-card{flex-basis:86vw;height:68vw;min-height:520px;}
}
@media(max-width:768px){
.gallery-card{flex-basis:86vw;height:72vw;min-height:340px;}
}
/* v14 updates */
.hero-shots{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}
.hero-shot{border:1px solid rgba(255,255,255,.16);background:#07101d;border-radius:12px;padding:0;overflow:hidden;cursor:pointer;min-height:72px}
.hero-shot img{width:100%;height:92px;object-fit:cover;opacity:.92;transition:transform .2s ease,opacity .2s ease}
.hero-shot:hover img{transform:scale(1.035);opacity:1}
.gallery-showcase{padding-top:34px;padding-bottom:48px}
.translation-gallery{gap:42px}
.gallery-card{flex:0 0 clamp(680px,40vw,1060px)!important;height:560px!important}
.gallery-card span{font-size:17px;padding:46px 16px 14px}
.language-select{font-size:16px}
@media(max-width:900px){.gallery-card{flex-basis:88vw!important;height:440px!important}.hero-shots{grid-template-columns:1fr}.hero-shot img{height:140px}}
/* v16: PNG logo + corrected app preview frame */
.brand-logo{
width:48px;
height:48px;
object-fit:contain;
flex:0 0 auto;
border-radius:12px;
}
.brand-mark{display:none!important;}
.app-frame{
width:100%;
max-width:1680px;
aspect-ratio:2048/1311;
padding:10px;
display:flex;
align-items:center;
justify-content:center;
overflow:hidden;
}
.app-frame > img#appPreviewImage{
width:100%;
height:100%;
object-fit:contain;
border-radius:16px;
background:#1f2024;
}
/* New app screenshot is wide: give the hero more room on desktop */
@media(min-width:1201px){
.hero{
grid-template-columns:.72fr 1.28fr;
gap:44px;
align-items:center;
}
.app-frame{justify-self:end;}
}
@media(min-width:2560px){
.app-frame{max-width:2100px;}
}
@media(max-width:1200px){
.app-frame{
max-width:1100px;
justify-self:center;
}
}
@media(max-width:768px){
.brand-logo{width:40px;height:40px;}
.app-frame{padding:7px;border-radius:18px;}
.app-frame > img#appPreviewImage{border-radius:12px;}
}
/* v17 WHITE THEME — clean SaaS landing page */
:root{
--page:94vw;
--max:3540px;
--header:96px;
--panel:#ffffff;
--panel2:#f8fafc;
--line:rgba(15,23,42,.12);
--muted:#64748b;
--blue:#2563eb;
--purple:#7c3aed;
--pink:#e11d48;
--shadow:0 28px 90px rgba(15,23,42,.12);
}
html,body{background:#f6f8fc!important;color:#0f172a!important;}
body{
background-image:
radial-gradient(circle at 72% 0%,rgba(124,58,237,.14),transparent 34%),
radial-gradient(circle at 14% 8%,rgba(37,99,235,.12),transparent 30%),
linear-gradient(180deg,#ffffff 0%,#f6f8fc 48%,#eef3fb 100%)!important;
}
.site-header{
background:rgba(255,255,255,.86)!important;
border-bottom:1px solid rgba(15,23,42,.10)!important;
box-shadow:0 10px 32px rgba(15,23,42,.055)!important;
}
.brand-text,.main-nav,body,a{color:#0f172a!important;}
.main-nav a{opacity:.82!important;}
.main-nav a:hover{color:#2563eb!important;opacity:1!important;}
.language-select{
background:#ffffff!important;
color:#0f172a!important;
border:1px solid rgba(15,23,42,.18)!important;
box-shadow:0 10px 26px rgba(15,23,42,.06)!important;
}
.top-download,.btn.primary{
color:#fff!important;
background:linear-gradient(135deg,#7c3aed,#2563eb)!important;
box-shadow:0 18px 40px rgba(37,99,235,.22)!important;
}
.btn.secondary{
background:#ffffff!important;
color:#0f172a!important;
border-color:rgba(15,23,42,.18)!important;
box-shadow:0 12px 28px rgba(15,23,42,.08)!important;
}
.eyebrow{color:#7c3aed!important;}
.hero h1{color:#0f172a!important;}
.hero h1 span{
background:linear-gradient(90deg,#7c3aed,#2563eb 70%)!important;
-webkit-background-clip:text!important;
background-clip:text!important;
color:transparent!important;
}
.hero-subtitle,.trial-note,.gallery-title p,.feature-cards p,.summary-left small,.panel-body,.small-note,.stats-strip span,.cta-panel p,.cta-panel small,.site-footer,.site-footer a:not(.brand){color:#475569!important;}
.hero-pills span{
background:#ffffff!important;
border:1px solid rgba(15,23,42,.12)!important;
color:#0f172a!important;
box-shadow:0 12px 30px rgba(15,23,42,.07)!important;
}
.hero-pills i{color:#2563eb!important;}
.app-frame{
background:linear-gradient(180deg,#ffffff,#eef3fb)!important;
border:1px solid rgba(15,23,42,.12)!important;
box-shadow:0 30px 90px rgba(15,23,42,.16)!important;
}
.app-frame > img#appPreviewImage{background:#202124!important;}
.gallery-showcase,.feature-cards article,.info-panel,.stats-strip,.cta-panel{
background:#ffffff!important;
border:1px solid rgba(15,23,42,.10)!important;
box-shadow:0 18px 54px rgba(15,23,42,.08)!important;
}
.gallery-title h2,.feature-cards h3,.summary-left b,.stats-strip b,.cta-panel h2,.site-footer h4,th{color:#0f172a!important;}
.title-icon{
background:#f5f3ff!important;
color:#7c3aed!important;
border-color:rgba(124,58,237,.24)!important;
}
.gallery-title strong{color:#2563eb!important;}
.translation-gallery{scrollbar-color:#cbd5e1 transparent!important;}
.gallery-card{
background:#f8fafc!important;
border:1px solid rgba(15,23,42,.12)!important;
box-shadow:0 16px 44px rgba(15,23,42,.13)!important;
}
.gallery-card img{background:#f8fafc!important;}
.gallery-card:hover,.gallery-card.active{
outline:3px solid #7c3aed!important;
box-shadow:0 18px 52px rgba(124,58,237,.22)!important;
}
.gallery-card span{
color:#fff!important;
background:linear-gradient(transparent,rgba(15,23,42,.82))!important;
}
.gallery-empty,.gallery-loading,.gallery-notice{
background:#f8fafc!important;
color:#475569!important;
border-color:rgba(37,99,235,.22)!important;
}
.gallery-arrow{
background:#ffffff!important;
color:#0f172a!important;
border:1px solid rgba(15,23,42,.10)!important;
box-shadow:0 14px 36px rgba(15,23,42,.14)!important;
}
.gallery-dots button{background:#cbd5e1!important;}
.gallery-dots button.active{background:#7c3aed!important;}
.info-panel summary{background:#ffffff!important;}
.info-panel em{color:#334155!important;}
td,th{border-bottom:1px solid rgba(15,23,42,.10)!important;}
.hardware-list div,.stats-strip div{border-color:rgba(15,23,42,.10)!important;}
.site-footer{border-top:1px solid rgba(15,23,42,.12)!important;}
.copyright{color:#94a3b8!important;}
.lightbox{background:rgba(15,23,42,.92)!important;}
.lightbox-counter{background:rgba(255,255,255,.92)!important;color:#0f172a!important;}
.lightbox-arrow{background:rgba(255,255,255,.92)!important;color:#0f172a!important;}
.lightbox-close{color:#fff!important;}
.hero-shot{background:#ffffff!important;border:1px solid rgba(15,23,42,.12)!important;box-shadow:0 10px 30px rgba(15,23,42,.08)!important;}
@media(max-width:768px){.site-header{background:rgba(255,255,255,.94)!important;}}
/* Pricing section v18 */
.pricing-section{margin-top:48px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(248,250,252,.82));box-shadow:0 24px 80px rgba(15,23,42,.08);padding:58px 42px;color:#0f172a;}
.pricing-head{text-align:center;max-width:980px;margin:0 auto 34px;}
.pricing-head .eyebrow{margin-bottom:12px;color:#7c3cff!important;}
.pricing-head h2{font-size:clamp(34px,3vw,58px);line-height:1.05;letter-spacing:-1.2px;color:#0f172a;}
.pricing-head p{font-size:18px;line-height:1.55;color:#475569;margin-top:16px;}
.pricing-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;max-width:1250px;margin:0 auto 34px;}
.price-card{position:relative;border:1px solid rgba(15,23,42,.12);border-radius:22px;background:#fff;padding:34px;box-shadow:0 18px 50px rgba(15,23,42,.08);display:flex;flex-direction:column;min-height:520px;}
.lifetime-card{border:2px solid rgba(124,60,255,.45);box-shadow:0 26px 80px rgba(124,60,255,.16);}
.best-badge{position:absolute;top:18px;right:18px;background:linear-gradient(135deg,var(--purple),var(--blue));color:#fff;border-radius:999px;padding:8px 14px;font-weight:900;font-size:13px;}
.price-card h3{font-size:30px;color:#0f172a;margin-bottom:8px;}
.price-card-top p{color:#64748b;line-height:1.45;font-size:16px;min-height:44px;}
.price-value{font-size:54px;line-height:1;font-weight:1000;color:#0f172a;margin:28px 0;letter-spacing:-1.5px;}
.price-card ul{list-style:none;display:grid;gap:13px;margin-bottom:30px;color:#1e293b;font-weight:700;line-height:1.35;}
.price-card li{border-bottom:1px solid rgba(15,23,42,.08);padding-bottom:12px;}
.price-btn{width:100%;margin-top:auto;height:62px;font-size:17px;}
.comparison-wrap{max-width:1250px;margin:0 auto;overflow:auto;border:1px solid rgba(15,23,42,.12);border-radius:18px;background:#fff;box-shadow:0 12px 40px rgba(15,23,42,.06);}
.comparison-table{min-width:720px;}
.comparison-table th{color:#0f172a!important;background:#f1f5f9;font-size:16px;}
.comparison-table td,.comparison-table th{padding:18px 22px;border-bottom:1px solid rgba(15,23,42,.1);}
.comparison-table td:not(:first-child),.comparison-table th:not(:first-child){text-align:center;font-weight:900;}
.comparison-table tr:last-child td{border-bottom:0;}
.pricing-note{text-align:center;max-width:980px;margin:24px auto 0;color:#475569;font-size:17px;line-height:1.55;font-weight:700;}
@media(max-width:900px){.pricing-section{padding:38px 18px}.pricing-cards{grid-template-columns:1fr}.price-card{min-height:auto;padding:26px}.price-value{font-size:44px}.best-badge{position:static;width:max-content;margin-bottom:16px}.pricing-head p{font-size:16px}}
/* v19: site light/dark toggle + screenshot carousel + 5-plan pricing */
.theme-toggle{
height:54px;
display:inline-flex;
align-items:center;
gap:8px;
border:1px solid rgba(15,23,42,.16);
border-radius:10px;
padding:0 15px;
background:#fff;
color:#0f172a;
font-weight:900;
cursor:pointer;
box-shadow:0 10px 26px rgba(15,23,42,.06);
}
.theme-icon{font-size:17px;line-height:1}.theme-text{font-size:14px}
.preview-mode-badge{
position:absolute;
top:20px;
left:22px;
z-index:2;
background:rgba(15,23,42,.78);
color:#fff;
border:1px solid rgba(255,255,255,.22);
border-radius:999px;
padding:8px 13px;
font-size:13px;
font-weight:900;
backdrop-filter:blur(12px);
}
.app-frame{position:relative;}
.app-frame > img#appPreviewImage{transition:opacity .28s ease, transform .28s ease;}
.app-frame.is-changing > img#appPreviewImage{opacity:.25;transform:scale(.985)}
.pricing-cards-five{grid-template-columns:repeat(5,minmax(0,1fr));max-width:1920px;gap:18px;}
.pricing-cards-five .price-card{padding:28px;min-height:560px;}
.pricing-cards-five .price-card h3{font-size:27px;}
.pricing-cards-five .price-card-top p{font-size:15px;min-height:44px;}
.pricing-cards-five .price-value{font-size:42px;}
.price-value span{font-size:17px;font-weight:900;color:#64748b;margin-left:4px;letter-spacing:0;}
.plan-badge{position:absolute;top:18px;right:18px;border-radius:999px;padding:8px 13px;font-size:12px;font-weight:1000;}
.plan-badge.subtle{background:#eef2ff;color:#3730a3;}
.popular-card{border:2px solid rgba(37,99,235,.38);box-shadow:0 24px 70px rgba(37,99,235,.14);}
.comparison-table{min-width:980px;}
body.theme-dark, body.theme-dark a{color:#f7f7ff!important;}
body.theme-dark{
background:#030913!important;
background-image:radial-gradient(circle at 70% 0%,rgba(72,54,174,.22),transparent 34%),radial-gradient(circle at 20% 20%,rgba(0,119,255,.13),transparent 28%)!important;
}
body.theme-dark .site-header{background:rgba(3,9,19,.82)!important;border-bottom:1px solid rgba(142,166,205,.18)!important;box-shadow:none!important;}
body.theme-dark .brand-text,body.theme-dark .main-nav,body.theme-dark .gallery-title h2,body.theme-dark .feature-cards h3,body.theme-dark .summary-left b,body.theme-dark .stats-strip b,body.theme-dark .cta-panel h2,body.theme-dark .site-footer h4,body.theme-dark th{color:#f7f7ff!important;}
body.theme-dark .main-nav a{color:#e9ecff!important;opacity:.9!important;}
body.theme-dark .main-nav a:hover{color:#8c6dff!important;}
body.theme-dark .language-select,body.theme-dark .theme-toggle{background:#07101d!important;color:#fff!important;border-color:rgba(142,166,205,.18)!important;box-shadow:none!important;}
body.theme-dark .btn.secondary{background:rgba(5,12,24,.7)!important;color:#fff!important;border-color:rgba(255,255,255,.18)!important;box-shadow:none!important;}
body.theme-dark .hero h1{color:#fff!important;}
body.theme-dark .hero-subtitle,body.theme-dark .trial-note,body.theme-dark .gallery-title p,body.theme-dark .feature-cards p,body.theme-dark .summary-left small,body.theme-dark .panel-body,body.theme-dark .small-note,body.theme-dark .stats-strip span,body.theme-dark .cta-panel p,body.theme-dark .cta-panel small,body.theme-dark .site-footer,body.theme-dark .site-footer a:not(.brand){color:#c2cadd!important;}
body.theme-dark .hero-pills span{background:rgba(9,20,38,.64)!important;border-color:rgba(142,166,205,.18)!important;color:#f4f6ff!important;box-shadow:none!important;}
body.theme-dark .app-frame{background:linear-gradient(180deg,rgba(18,24,36,.9),rgba(5,10,18,.9))!important;border-color:rgba(139,154,190,.24)!important;box-shadow:0 28px 100px rgba(0,0,0,.34)!important;}
body.theme-dark .gallery-showcase,body.theme-dark .feature-cards article,body.theme-dark .info-panel,body.theme-dark .stats-strip,body.theme-dark .cta-panel,body.theme-dark .pricing-section{background:linear-gradient(180deg,rgba(8,20,37,.88),rgba(5,12,24,.82))!important;border-color:rgba(142,166,205,.18)!important;box-shadow:0 28px 100px rgba(0,0,0,.28)!important;color:#f7f7ff!important;}
body.theme-dark .price-card,body.theme-dark .comparison-wrap{background:rgba(13,26,45,.92)!important;border-color:rgba(142,166,205,.18)!important;box-shadow:0 18px 56px rgba(0,0,0,.22)!important;color:#f7f7ff!important;}
body.theme-dark .price-card h3,body.theme-dark .price-value,body.theme-dark .pricing-head h2{color:#fff!important;}
body.theme-dark .price-card-top p,body.theme-dark .pricing-head p,body.theme-dark .pricing-note,body.theme-dark .price-value span{color:#aab4c8!important;}
body.theme-dark .price-card ul{color:#e8edff!important;}
body.theme-dark .price-card li,body.theme-dark .comparison-table td,body.theme-dark .comparison-table th{border-color:rgba(142,166,205,.18)!important;}
body.theme-dark .comparison-table th{background:rgba(255,255,255,.06)!important;color:#fff!important;}
body.theme-dark .plan-badge.subtle{background:rgba(37,99,235,.18);color:#bcd2ff;}
body.theme-dark .gallery-card{background:#111827!important;border-color:rgba(255,255,255,.14)!important;box-shadow:0 12px 34px rgba(0,0,0,.28)!important;}
body.theme-dark .gallery-card img{background:#050914!important;}
body.theme-dark .gallery-arrow{background:rgba(23,32,52,.92)!important;color:#fff!important;border:0!important;box-shadow:none!important;}
body.theme-dark .gallery-empty,body.theme-dark .gallery-loading,body.theme-dark .gallery-notice{background:rgba(255,255,255,.035)!important;color:#b7c1d8!important;border-color:rgba(139,92,246,.4)!important;}
body.theme-dark .info-panel summary{background:transparent!important;}
body.theme-dark .hardware-list div,body.theme-dark .stats-strip div,body.theme-dark .site-footer{border-color:rgba(142,166,205,.18)!important;}
body.theme-dark .hero-shot{background:#07101d!important;border-color:rgba(255,255,255,.16)!important;box-shadow:none!important;}
@media(max-width:1500px){.pricing-cards-five{grid-template-columns:repeat(3,minmax(0,1fr));}.pricing-cards-five .price-card{min-height:520px;}}
@media(max-width:900px){.pricing-cards-five{grid-template-columns:1fr}.pricing-cards-five .price-card{min-height:auto}.theme-text{display:none}.theme-toggle{width:54px;justify-content:center;padding:0}.preview-mode-badge{top:14px;left:14px;font-size:12px}}
/* v20: Smart Context guide page + asset references */
.smart-guide-promo{
margin-top:36px;
border:1px solid rgba(15,23,42,.12);
border-radius:22px;
background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(239,246,255,.9));
box-shadow:0 22px 70px rgba(15,23,42,.08);
padding:38px 42px;
display:flex;
align-items:center;
justify-content:space-between;
gap:32px;
}
.smart-guide-copy{max-width:980px}.smart-guide-copy .eyebrow{margin-bottom:8px}.smart-guide-copy h2{font-size:clamp(30px,2vw,46px);line-height:1.05;color:#0f172a}.smart-guide-copy p{margin-top:12px;color:#475569;font-size:17px;line-height:1.55}
.guide-page{padding-top:46px}.guide-hero{border:1px solid rgba(15,23,42,.12);border-radius:26px;background:linear-gradient(135deg,rgba(255,255,255,.95),rgba(239,246,255,.86));box-shadow:0 24px 80px rgba(15,23,42,.08);padding:68px 58px;margin-top:34px}.guide-hero h1{font-size:clamp(44px,4vw,86px);line-height:.98;letter-spacing:-1.8px;color:#0f172a}.guide-hero p{max-width:1120px;margin-top:20px;font-size:21px;line-height:1.55;color:#475569}.guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:30px}.guide-grid article,.guide-section{border:1px solid rgba(15,23,42,.12);border-radius:22px;background:#fff;box-shadow:0 18px 55px rgba(15,23,42,.07);padding:34px}.guide-grid h2,.guide-section h2{font-size:30px;color:#0f172a;margin-bottom:14px}.guide-grid p,.guide-grid li,.guide-section p{color:#475569;font-size:17px;line-height:1.65}.guide-grid ul{padding-left:20px}.guide-example{border:1px solid rgba(15,23,42,.12);border-radius:14px;background:#f8fafc;padding:18px;color:#334155;margin:12px 0;font-size:16px;line-height:1.5}.guide-example.good{background:#eef2ff;border-color:rgba(124,58,237,.24)}.guide-section{margin-top:30px}.guide-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.guide-steps div,.profile-grid div{border:1px solid rgba(15,23,42,.10);border-radius:16px;background:#f8fafc;padding:22px}.guide-steps b{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--purple),var(--blue));color:#fff;margin-bottom:14px}.guide-steps span{color:#475569;line-height:1.5;font-weight:700}.profile-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.profile-grid h3{font-size:21px;margin-bottom:8px;color:#0f172a}.profile-grid p{color:#475569;line-height:1.55}
body.theme-dark .smart-guide-promo,body.theme-dark .guide-hero,body.theme-dark .guide-grid article,body.theme-dark .guide-section{background:linear-gradient(180deg,rgba(8,20,37,.88),rgba(5,12,24,.82))!important;border-color:rgba(142,166,205,.18)!important;box-shadow:0 28px 100px rgba(0,0,0,.28)!important;color:#f7f7ff!important}body.theme-dark .smart-guide-copy h2,body.theme-dark .guide-hero h1,body.theme-dark .guide-grid h2,body.theme-dark .guide-section h2,body.theme-dark .profile-grid h3{color:#fff!important}body.theme-dark .smart-guide-copy p,body.theme-dark .guide-hero p,body.theme-dark .guide-grid p,body.theme-dark .guide-grid li,body.theme-dark .guide-section p{color:#c2cadd!important}body.theme-dark .guide-example,body.theme-dark .guide-steps div,body.theme-dark .profile-grid div{background:rgba(255,255,255,.045)!important;border-color:rgba(142,166,205,.18)!important;color:#dbe7ff!important}body.theme-dark .guide-example.good{background:rgba(124,58,237,.14)!important;border-color:rgba(124,58,237,.35)!important}body.theme-dark .guide-steps span{color:#c2cadd!important}
@media(max-width:1100px){.smart-guide-promo{display:block}.smart-guide-promo .btn{margin-top:22px}.guide-grid,.guide-steps,.profile-grid{grid-template-columns:1fr}.guide-hero{padding:46px 28px}.guide-hero p{font-size:18px}}
/* v21 fixes: exact app preview, video overlay, faster theme visual switch */
.app-frame{
position:relative!important;
padding:0!important;
border:0!important;
background:transparent!important;
box-shadow:none!important;
max-width:1420px!important;
overflow:visible!important;
}
.app-frame::before,.app-frame::after{display:none!important;content:none!important;}
.app-preview-button{
display:block;
position:relative;
width:100%;
padding:0;
margin:0;
border:0;
background:transparent;
cursor:pointer;
border-radius:22px;
overflow:hidden;
box-shadow:0 26px 80px rgba(15,23,42,.18);
}
body.theme-dark .app-preview-button{box-shadow:0 30px 95px rgba(0,0,0,.42);}
.app-frame img,.app-preview-button img{
display:block;
width:100%;
height:auto;
border-radius:22px!important;
}
.preview-mode-badge{
top:18px!important;
left:18px!important;
z-index:3!important;
pointer-events:none;
}
.play-overlay{
position:absolute;
inset:0;
display:flex;
align-items:center;
justify-content:center;
gap:14px;
font-size:18px;
font-weight:900;
color:#fff;
background:rgba(2,6,23,.06);
opacity:0;
transition:opacity .16s ease, background .16s ease;
z-index:2;
}
.play-overlay span{
width:70px;
height:70px;
border-radius:999px;
display:grid;
place-items:center;
background:linear-gradient(135deg,var(--purple),var(--blue));
box-shadow:0 18px 46px rgba(37,99,235,.38);
padding-left:4px;
}
.play-overlay b{
background:rgba(15,23,42,.72);
border:1px solid rgba(255,255,255,.18);
padding:13px 18px;
border-radius:999px;
}
.app-preview-button:hover .play-overlay{opacity:1;background:rgba(2,6,23,.18);}
.app-frame.is-changing{opacity:1!important;filter:none!important;}
.hero-shot{border-radius:14px!important;overflow:hidden;}
.video-modal{
position:fixed;
inset:0;
display:none;
align-items:center;
justify-content:center;
padding:32px;
background:rgba(2,6,23,.82);
backdrop-filter:blur(18px);
z-index:200;
}
.video-modal.active{display:flex;}
.video-modal-inner{
position:relative;
width:min(92vw,1400px);
background:#020617;
border:1px solid rgba(255,255,255,.16);
border-radius:22px;
box-shadow:0 30px 120px rgba(0,0,0,.55);
padding:18px;
}
.demo-video{
width:100%;
max-height:78vh;
display:block;
border-radius:14px;
background:#000;
}
.video-close{
position:absolute;
top:-18px;
right:-18px;
width:48px;
height:48px;
border-radius:999px;
border:1px solid rgba(255,255,255,.2);
background:#111827;
color:#fff;
font-size:32px;
cursor:pointer;
z-index:2;
}
.video-help{
color:#cbd5e1;
font-size:14px;
margin:12px 4px 0;
text-align:center;
}
.video-help b{color:#fff;}
@media(max-width:900px){
.play-overlay{opacity:1;background:rgba(2,6,23,.06);}
.play-overlay b{display:none;}
.play-overlay span{width:56px;height:56px;}
.video-modal{padding:14px;}
.video-close{top:8px;right:8px;}
}
/* v22 fixes */
/* Header logo uses PNG assets and switches with theme via JS. */
.brand-logo{object-fit:contain;transition:opacity .12s ease,transform .12s ease;}
.language-select{display:none!important;}
.custom-language{position:relative;min-width:210px;z-index:70;}
.custom-language-button{height:54px;width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:10px;background:#07101d;color:#fff;padding:0 14px;font-weight:850;cursor:pointer;}
.custom-language-list{position:absolute;top:calc(100% + 8px);right:0;min-width:260px;max-height:min(72vh,620px);overflow:auto;padding:8px;border:1px solid var(--line);border-radius:14px;background:#07101d;box-shadow:0 24px 70px rgba(0,0,0,.38);display:none;}
.custom-language.open .custom-language-list{display:block;}
.custom-language-option{width:100%;display:flex;align-items:center;gap:12px;border:0;border-radius:9px;background:transparent;color:#fff;padding:11px 12px;text-align:left;font-weight:850;cursor:pointer;}
.custom-language-option:hover,.custom-language-option.active{background:rgba(35,136,255,.24);}
.flag-img{width:24px;height:24px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px rgba(255,255,255,.22);flex:0 0 auto;}
.custom-language-caret{opacity:.7;font-size:16px;}
body:not(.theme-dark) .custom-language-button{background:#fff!important;color:#0f172a!important;border-color:#dbe4f0!important;box-shadow:0 10px 30px rgba(15,23,42,.06)!important;}
body:not(.theme-dark) .custom-language-list{background:#fff!important;border-color:#dbe4f0!important;box-shadow:0 28px 70px rgba(15,23,42,.16)!important;}
body:not(.theme-dark) .custom-language-option{color:#0f172a!important;}
body:not(.theme-dark) .custom-language-option:hover,body:not(.theme-dark) .custom-language-option.active{background:#e9f2ff!important;}
.hero .eyebrow{display:none!important;}
.hero-pills .highlight-pill{background:linear-gradient(135deg,rgba(124,60,255,.18),rgba(35,136,255,.18));}
@media(max-width:600px){
.feature-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;}
.feature-cards article{padding:20px 16px!important;min-height:210px!important;border-radius:20px!important;display:flex;flex-direction:column;justify-content:flex-start;}
.feature-icon{width:42px!important;height:42px!important;margin-bottom:16px!important;}
.feature-cards h3{font-size:17px!important;line-height:1.15!important;margin-bottom:9px!important;}
.feature-cards p{font-size:14px!important;line-height:1.35!important;}
}
@media(max-width:360px){
.feature-cards{gap:10px!important;}
.feature-cards article{padding:16px 12px!important;min-height:190px!important;}
.feature-cards h3{font-size:15px!important;}
.feature-cards p{font-size:12.5px!important;}
}
/* ===============================
V23 Release Candidate refinements
=============================== */
.version-badge{
height:40px;min-width:58px;padding:0 14px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;
border:1px solid rgba(37,99,235,.22);background:rgba(37,99,235,.08);color:#2563eb;font-weight:1000;font-size:14px;
}
body.theme-dark .version-badge{background:rgba(124,60,255,.15);border-color:rgba(124,60,255,.32);color:#d8ccff}
.hero h1{max-width:1120px!important;}
.hero-subtitle{max-width:900px!important;font-weight:650;}
.hero-pills{display:grid!important;grid-template-columns:repeat(2,minmax(260px,1fr));gap:16px!important;max-width:900px;margin-top:34px!important;}
.hero-pills span{padding:18px 20px!important;font-size:clamp(18px,1.05vw,23px)!important;font-weight:950!important;border-radius:16px!important;box-shadow:0 14px 38px rgba(15,23,42,.08);}
.hero-pills span:last-child{grid-column:1/-1;max-width:470px;}
.hero-pills i{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(34,197,94,.14);color:#16a34a!important;font-size:20px;font-weight:1000;flex:0 0 30px;}
body.theme-dark .hero-pills i{background:rgba(34,197,94,.18);color:#65ff98!important;}
.hero-pills .highlight-pill{border-color:rgba(37,99,235,.26)!important;background:linear-gradient(135deg,rgba(37,99,235,.10),rgba(124,58,237,.10))!important;}
.hero-actions{margin-top:38px!important;}
.trial-note{font-weight:850;}
.app-preview-button img{transition:opacity .16s ease,transform .16s ease!important;}
.app-frame.is-changing > img#appPreviewImage,.app-frame.is-changing .app-preview-button img{opacity:.55!important;transform:scale(.992)!important;}
.gallery-showcase{margin-top:42px!important;}
.gallery-title h2{font-size:clamp(30px,2vw,48px)!important;}
.pricing-section{margin-top:36px!important;margin-bottom:34px!important;}
.pricing-head .eyebrow{margin-bottom:12px;}
.pricing-head h2{font-size:clamp(34px,2.6vw,62px);letter-spacing:-.8px;margin-bottom:12px;}
.price-card.lifetime-card{transform:translateY(-8px);}
.feature-cards{margin-top:36px!important;}
.smart-guide-promo{margin-top:34px!important;}
.site-footer{grid-template-columns:1.55fr repeat(4,.75fr)!important;gap:44px!important;align-items:start;}
.site-footer .brand-logo{width:48px;height:48px;object-fit:contain;}
.site-footer h4{font-size:16px;text-transform:uppercase;letter-spacing:.12em;color:#64748b!important;}
body.theme-dark .site-footer h4{color:#b7c4dc!important;}
.site-footer a:not(.brand){font-weight:800;margin:10px 0!important;}
.copyright{grid-column:1/-1!important;}
/* User/Legal page shared styles */
.doc-page{padding:54px 0 70px;}
.doc-hero{border:1px solid rgba(15,23,42,.12);border-radius:28px;background:linear-gradient(135deg,#fff,#eef6ff);box-shadow:0 24px 80px rgba(15,23,42,.08);padding:66px 58px;margin-top:34px;}
.doc-hero h1{font-size:clamp(42px,4vw,82px);line-height:.98;letter-spacing:-1.6px;color:#0f172a;}
.doc-hero p{max-width:1050px;margin-top:18px;font-size:21px;line-height:1.55;color:#475569;font-weight:650;}
.doc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:28px;}
.doc-card,.doc-section{border:1px solid rgba(15,23,42,.12);border-radius:22px;background:#fff;box-shadow:0 18px 55px rgba(15,23,42,.07);padding:32px;}
.doc-card h2,.doc-section h2{font-size:28px;color:#0f172a;margin-bottom:12px;}
.doc-card p,.doc-card li,.doc-section p,.doc-section li{color:#475569;font-size:17px;line-height:1.62;}
.doc-card ul,.doc-section ul{padding-left:22px;}
.doc-section{margin-top:24px;}
.doc-kbd{display:inline-block;padding:4px 8px;border:1px solid rgba(15,23,42,.14);border-radius:8px;background:#f8fafc;font-weight:900;color:#334155;}
body.theme-dark .doc-hero,body.theme-dark .doc-card,body.theme-dark .doc-section{background:linear-gradient(180deg,rgba(8,20,37,.88),rgba(5,12,24,.82))!important;border-color:rgba(142,166,205,.18)!important;box-shadow:0 28px 100px rgba(0,0,0,.28)!important;}
body.theme-dark .doc-hero h1,body.theme-dark .doc-card h2,body.theme-dark .doc-section h2{color:#fff!important;}
body.theme-dark .doc-hero p,body.theme-dark .doc-card p,body.theme-dark .doc-card li,body.theme-dark .doc-section p,body.theme-dark .doc-section li{color:#c2cadd!important;}
body.theme-dark .doc-kbd{background:rgba(255,255,255,.06);border-color:rgba(142,166,205,.2);color:#e5edff;}
@media(max-width:1320px){
.site-footer{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
.hero-pills{grid-template-columns:1fr;}
.hero-pills span:last-child{grid-column:auto;max-width:none;}
}
@media(max-width:900px){
.version-badge{display:none;}
.hero-pills span{font-size:17px!important;padding:15px 16px!important;}
.pricing-section{order:initial;}
.doc-grid{grid-template-columns:1fr;}
.doc-hero{padding:42px 26px;}
.doc-hero p{font-size:18px;}
}
@media(max-width:600px){
.hero-pills{gap:10px!important;}
.hero-pills span{font-size:15px!important;border-radius:14px!important;}
.hero-pills i{width:26px;height:26px;font-size:17px;flex-basis:26px;}
.site-footer{grid-template-columns:1fr!important;gap:28px!important;}
}
/* ===============================
V24 language + logo refinements
=============================== */
.brand-logo{
width:64px!important;
height:64px!important;
object-fit:contain!important;
border-radius:18px!important;
padding:5px!important;
background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(229,238,255,.82))!important;
box-shadow:0 18px 42px rgba(15,23,42,.18), inset 0 1px 0 rgba(255,255,255,.85)!important;
filter:drop-shadow(0 10px 18px rgba(37,99,235,.18))!important;
}
body.theme-dark .brand-logo{
background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(214,229,255,.78))!important;
box-shadow:0 18px 46px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.12), inset 0 1px 0 rgba(255,255,255,.92)!important;
filter:drop-shadow(0 12px 24px rgba(124,60,255,.26))!important;
}
.footer-brand .brand-logo{width:56px!important;height:56px!important;}
.hero-language-note{
max-width:880px;
margin-top:16px;
color:#64748b;
font-size:15px;
line-height:1.45;
font-weight:750;
}
body.theme-dark .hero-language-note{color:#b9c2d4;}
.hero-pills .lifetime-pill{
border:1px solid rgba(124,58,237,.45)!important;
background:linear-gradient(135deg,rgba(124,58,237,.22),rgba(37,99,235,.14))!important;
box-shadow:0 22px 58px rgba(124,58,237,.20)!important;
}
.hero-pills .lifetime-pill b{
color:#7c3cff!important;
font-size:1.08em!important;
letter-spacing:-.2px;
}
body.theme-dark .hero-pills .lifetime-pill b{color:#d7c6ff!important;}
.pricing-note::after{
content:' *200+ language coverage depends on the compatible AI model loaded in LM Studio.';
display:block;
margin-top:8px;
opacity:.86;
}
@media(max-width:600px){
.brand-logo{width:52px!important;height:52px!important;border-radius:15px!important;padding:4px!important;}
.hero-language-note{font-size:13px;margin-top:12px;}
.hero-pills .lifetime-pill b{font-size:1em!important;}
}
/* ===============================
V25 cleanup: unified guide, separate comparison page, final logo
=============================== */
.brand-logo{
width:72px!important;
height:72px!important;
object-fit:contain!important;
padding:0!important;
border-radius:0!important;
background:transparent!important;
box-shadow:none!important;
filter:drop-shadow(0 12px 22px rgba(15,23,42,.20))!important;
}
body.theme-dark .brand-logo{
background:transparent!important;
box-shadow:none!important;
filter:drop-shadow(0 14px 28px rgba(0,0,0,.42)) drop-shadow(0 0 16px rgba(124,60,255,.16))!important;
}
.site-header .brand{gap:14px!important;}
.brand-text{letter-spacing:-.3px;}
.hero-pills-v25 span{min-height:92px;}
.hero-pills-v25 .lifetime-pill{
grid-column:1 / -1;
max-width:640px;
}
.hero-pills-v25 .lifetime-pill b{
font-size:clamp(22px,1.45vw,34px)!important;
color:#7c3cff!important;
}
body.theme-dark .hero-pills-v25 .lifetime-pill b{color:#d7c6ff!important;}
.pricing-section .comparison-wrap{display:none;}
.pricing-page-section .comparison-wrap{display:block;}
.pricing-page-section{margin-top:34px!important;}
.pricing-page-section .pricing-note::after{content:''!important;display:none!important;}
.smart-guide-promo{align-items:center;}
.doc-page{padding-top:44px;padding-bottom:60px;}
.doc-hero{margin-top:34px;}
.doc-grid article{min-height:260px;}
.footer-brand .brand-logo{width:68px!important;height:68px!important;}
.site-footer{grid-template-columns:1.2fr .65fr .65fr .65fr .65fr!important;}
@media(max-width:1100px){
.site-footer{grid-template-columns:1fr 1fr!important;}
}
@media(max-width:700px){
.brand-logo{width:58px!important;height:58px!important;}
.hero-pills-v25{grid-template-columns:1fr 1fr!important;}
.hero-pills-v25 span{min-height:78px;}
.hero-pills-v25 .lifetime-pill{grid-column:1 / -1;}
}
@media(max-width:380px){
.hero-pills-v25{grid-template-columns:1fr!important;}
}
.doc-grid > article{
border:1px solid var(--line);
border-radius:22px;
background:var(--panel);
padding:34px;
box-shadow:0 18px 56px rgba(15,23,42,.06);
}
.doc-grid > article h2{font-size:26px;margin-bottom:12px;color:#0f172a;}
.doc-grid > article p{font-size:17px;line-height:1.55;color:#475569;}
body.theme-dark .doc-grid > article{background:linear-gradient(180deg,rgba(8,20,37,.88),rgba(5,12,24,.82));border-color:rgba(142,166,205,.18);}
body.theme-dark .doc-grid > article h2{color:#fff;}
body.theme-dark .doc-grid > article p{color:#c2cadd;}
/* ===============================
V26 commercial pricing + theme logos
=============================== */
.brand-logo{width:64px!important;height:64px!important;object-fit:contain!important;background:transparent!important;border-radius:0!important;padding:0!important;filter:drop-shadow(0 10px 22px rgba(15,23,42,.20))!important;}
body.theme-dark .brand-logo{filter:drop-shadow(0 12px 24px rgba(0,0,0,.48)) drop-shadow(0 0 16px rgba(245,158,11,.16))!important;}
.footer-brand .brand-logo{width:62px!important;height:62px!important;}
.pricing-cards-v26 .price-card{min-height:650px;}
.pricing-cards-v26 .price-card ul{gap:10px;}
.plan-focus{display:inline-flex;align-items:center;justify-content:center;margin:18px 0 18px;padding:13px 16px;border-radius:14px;background:rgba(37,99,235,.10);border:1px solid rgba(37,99,235,.18);font-size:18px;font-weight:1000;color:#1d4ed8;}
.plan-focus.unlimited{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.22);color:#15803d;}
.plan-focus.lifetime-focus{background:linear-gradient(135deg,rgba(124,60,255,.18),rgba(35,136,255,.16));border-color:rgba(124,60,255,.34);color:#6d28d9;}
body.theme-dark .plan-focus{background:rgba(59,130,246,.14);border-color:rgba(96,165,250,.22);color:#bfdbfe;}
body.theme-dark .plan-focus.unlimited{background:rgba(34,197,94,.14);border-color:rgba(34,197,94,.26);color:#bbf7d0;}
body.theme-dark .plan-focus.lifetime-focus{background:linear-gradient(135deg,rgba(124,60,255,.26),rgba(35,136,255,.18));border-color:rgba(167,139,250,.44);color:#e9d5ff;}
.pricing-cards-v26 .lifetime-card{border-width:2px;}
.pricing-cards-v26 .price-card li{font-size:15px;}
.comparison-table .pages-row td{font-size:1.08em;font-weight:900;background:rgba(34,197,94,.055);}
body.theme-dark .comparison-table .pages-row td{background:rgba(34,197,94,.09);}
.site-footer{grid-template-columns:1.2fr .65fr .65fr .65fr .65fr!important;}
.site-footer h4{letter-spacing:.14em;text-transform:uppercase;font-size:14px;}
@media(max-width:1500px){.pricing-cards-v26{grid-template-columns:repeat(3,minmax(0,1fr));}.pricing-cards-v26 .price-card{min-height:580px;}}
@media(max-width:900px){.pricing-cards-v26{grid-template-columns:1fr}.pricing-cards-v26 .price-card{min-height:auto}.brand-logo{width:54px!important;height:54px!important}.footer-brand .brand-logo{width:56px!important;height:56px!important}}
/* ===============================
V27 mobile/header/pricing polish
=============================== */
/* six colored hero value badges */
.hero-pills{grid-template-columns:repeat(2,minmax(250px,1fr))!important;}
.hero-pills span:last-child{grid-column:auto!important;max-width:none!important;}
.hero-pills span:nth-child(1){--pill:#22c55e;--pill-bg:rgba(34,197,94,.12);--pill-border:rgba(34,197,94,.28)}
.hero-pills span:nth-child(2){--pill:#3b82f6;--pill-bg:rgba(59,130,246,.13);--pill-border:rgba(59,130,246,.30)}
.hero-pills span:nth-child(3){--pill:#8b5cf6;--pill-bg:rgba(139,92,246,.14);--pill-border:rgba(139,92,246,.32)}
.hero-pills span:nth-child(4){--pill:#f59e0b;--pill-bg:rgba(245,158,11,.15);--pill-border:rgba(245,158,11,.32)}
.hero-pills span:nth-child(5){--pill:#ec4899;--pill-bg:rgba(236,72,153,.13);--pill-border:rgba(236,72,153,.30)}
.hero-pills span:nth-child(6){--pill:#06b6d4;--pill-bg:rgba(6,182,212,.13);--pill-border:rgba(6,182,212,.30)}
.hero-pills span{background:var(--pill-bg)!important;border-color:var(--pill-border)!important;}
.hero-pills span i{background:color-mix(in srgb,var(--pill) 18%, transparent)!important;color:var(--pill)!important;}
body.theme-dark .hero-pills span{background:color-mix(in srgb,var(--pill) 17%, #061224 83%)!important;border-color:color-mix(in srgb,var(--pill) 38%, transparent)!important;}
body.theme-dark .hero-pills span i{background:color-mix(in srgb,var(--pill) 24%, transparent)!important;color:color-mix(in srgb,var(--pill) 80%, white 20%)!important;}
/* six colored feature cards */
.feature-c1{color:#8b5cf6!important}.feature-c2{color:#0ea5e9!important}.feature-c3{color:#22c55e!important}.feature-c4{color:#f59e0b!important}.feature-c5{color:#ec4899!important}.feature-c6{color:#06b6d4!important}
.feature-cards article:nth-child(1){--f:#8b5cf6}.feature-cards article:nth-child(2){--f:#0ea5e9}.feature-cards article:nth-child(3){--f:#22c55e}.feature-cards article:nth-child(4){--f:#f59e0b}.feature-cards article:nth-child(5){--f:#ec4899}.feature-cards article:nth-child(6){--f:#06b6d4}
.feature-cards article{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--f, #2388ff) 10%, transparent),0 18px 45px rgba(15,23,42,.06)!important;}
body.theme-dark .feature-cards article{background:linear-gradient(180deg,color-mix(in srgb,var(--f, #2388ff) 9%, rgba(8,20,37,.88)),rgba(5,12,24,.86))!important;border-color:color-mix(in srgb,var(--f, #2388ff) 24%, rgba(142,166,205,.18))!important;}
/* plan color hierarchy */
.pricing-cards-v26 .price-card{position:relative;overflow:hidden;}
.pricing-cards-v26 .price-card::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--plan-color,#64748b);opacity:.95;}
.plan-free{--plan-color:#64748b!important;border-color:rgba(100,116,139,.26)!important;}
.plan-month{--plan-color:#2563eb!important;border-color:rgba(37,99,235,.38)!important;}
.plan-six{--plan-color:#7c3aed!important;border-color:rgba(124,58,237,.38)!important;}
.plan-year{--plan-color:#f59e0b!important;border-color:rgba(245,158,11,.55)!important;box-shadow:0 0 0 1px rgba(245,158,11,.22),0 22px 70px rgba(245,158,11,.12)!important;}
.plan-life{--plan-color:#facc15!important;border-color:rgba(250,204,21,.70)!important;box-shadow:0 0 0 1px rgba(250,204,21,.28),0 28px 90px rgba(250,204,21,.20)!important;}
.plan-free .plan-focus{background:rgba(100,116,139,.10)!important;border-color:rgba(100,116,139,.22)!important;color:#475569!important;}
.plan-month .plan-focus{background:rgba(37,99,235,.12)!important;border-color:rgba(37,99,235,.28)!important;color:#1d4ed8!important;}
.plan-six .plan-focus{background:rgba(124,58,237,.12)!important;border-color:rgba(124,58,237,.28)!important;color:#6d28d9!important;}
.plan-year .plan-focus{background:rgba(245,158,11,.18)!important;border-color:rgba(245,158,11,.34)!important;color:#b45309!important;}
.plan-life .plan-focus{background:linear-gradient(135deg,rgba(250,204,21,.22),rgba(245,158,11,.15))!important;border-color:rgba(250,204,21,.42)!important;color:#a16207!important;}
.plan-month .price-btn{background:linear-gradient(135deg,#2563eb,#3b82f6)!important;color:#fff!important;border-color:transparent!important;}
.plan-six .price-btn{background:linear-gradient(135deg,#7c3aed,#a855f7)!important;color:#fff!important;border-color:transparent!important;}
.plan-year .price-btn{background:linear-gradient(135deg,#f59e0b,#facc15)!important;color:#111827!important;border-color:transparent!important;box-shadow:0 18px 45px rgba(245,158,11,.24)!important;}
.plan-life .price-btn{background:linear-gradient(135deg,#facc15,#f59e0b)!important;color:#111827!important;border-color:transparent!important;box-shadow:0 22px 60px rgba(250,204,21,.30)!important;}
body.theme-dark .plan-free .plan-focus{background:rgba(100,116,139,.18)!important;color:#cbd5e1!important;}
body.theme-dark .plan-month .plan-focus{background:rgba(37,99,235,.20)!important;color:#bfdbfe!important;}
body.theme-dark .plan-six .plan-focus{background:rgba(124,58,237,.22)!important;color:#ddd6fe!important;}
body.theme-dark .plan-year .plan-focus{background:rgba(245,158,11,.23)!important;color:#fde68a!important;}
body.theme-dark .plan-life .plan-focus{background:linear-gradient(135deg,rgba(250,204,21,.25),rgba(245,158,11,.20))!important;color:#fef3c7!important;}
.pricing-cards-v26 .free-plan ul{opacity:.92;}
.pricing-cards-v26 .price-card li{line-height:1.35;}
/* compact mobile header under 500px: logo/title first row, theme + language same row */
@media(max-width:500px){
:root{--header:auto!important;--page:94vw!important;}
.site-header{position:sticky!important;top:0!important;min-height:0!important;height:auto!important;padding:8px 0 10px!important;}
.nav-shell{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;padding:6px 0!important;justify-items:center!important;width:94vw!important;}
.brand{width:100%!important;justify-content:center!important;gap:10px!important;}
.brand-logo{width:48px!important;height:48px!important;}
.brand-text{font-size:18px!important;line-height:1.08!important;text-align:left!important;}
.main-nav,.top-download,.version-badge{display:none!important;}
.nav-actions{width:100%!important;margin:0!important;display:grid!important;grid-template-columns:64px minmax(0,1fr)!important;gap:10px!important;align-items:center!important;justify-content:stretch!important;}
.theme-toggle{width:64px!important;height:50px!important;border-radius:14px!important;padding:0!important;justify-content:center!important;}
.theme-toggle .theme-icon{font-size:24px!important;}
.theme-toggle .theme-text{display:none!important;}
.custom-language{min-width:0!important;width:100%!important;}
.custom-language-button{height:50px!important;border-radius:14px!important;font-size:16px!important;}
.custom-language-list{right:0!important;left:auto!important;min-width:100%!important;width:100%!important;max-height:62vh!important;}
.hero{padding-top:28px!important;}
.hero h1{font-size:36px!important;line-height:1.05!important;letter-spacing:-1.1px!important;}
.hero-subtitle{font-size:17px!important;line-height:1.45!important;}
.hero-pills{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;margin-top:24px!important;}
.hero-pills span{padding:14px 10px!important;min-height:84px!important;font-size:16px!important;justify-content:flex-start!important;align-items:center!important;}
.hero-pills i{width:28px!important;height:28px!important;flex-basis:28px!important;font-size:18px!important;}
.hero-language-note{font-size:14px!important;line-height:1.45!important;}
.gallery-showcase{padding-left:18px!important;padding-right:18px!important;}
.gallery-card{flex-basis:88vw!important;height:118vw!important;min-height:420px!important;}
.gallery-card img{object-fit:contain!important;}
.gallery-arrow.left{left:4px!important}.gallery-arrow.right{right:4px!important}
}
@media(max-width:360px){
.hero-pills{grid-template-columns:1fr!important;}
.hero-pills span{min-height:68px!important;}
}
/* ===============================
V28 pricing + mobile header cleanup
=============================== */
/* Hero value badges: keep 5 values. On two-column layouts the final Lifetime badge spans the full row. */
.hero-pills{grid-template-columns:repeat(2,minmax(250px,1fr))!important;}
.hero-pills span:nth-child(5){grid-column:1 / -1!important;}
@media(max-width:500px){.hero-pills span:nth-child(5){grid-column:1 / -1!important;}}
@media(max-width:360px){.hero-pills span:nth-child(5){grid-column:auto!important;}}
/* Pricing: same visible core features on every plan, extra features expanded by one global toggle. */
.features-toggle{margin:22px auto 0;min-height:50px;padding:0 20px;border-radius:999px;border:1px solid rgba(124,60,255,.25);background:rgba(124,60,255,.08);color:#5b21b6;font-weight:1000;font-size:15px;display:inline-flex;align-items:center;gap:10px;cursor:pointer;transition:transform .16s ease,background .16s ease,border-color .16s ease;}
.features-toggle:hover{transform:translateY(-1px);background:rgba(124,60,255,.13);border-color:rgba(124,60,255,.38)}
.features-toggle .toggle-arrow{font-size:20px;line-height:1;transition:transform .18s ease;}
.pricing-section.features-open .features-toggle .toggle-arrow{transform:rotate(180deg)}
body.theme-dark .features-toggle{background:rgba(124,60,255,.18);border-color:rgba(167,139,250,.32);color:#e9d5ff;}
.pricing-cards-v28 .price-card{min-height:620px;}
.pricing-cards-v28 .plan-core,.pricing-cards-v28 .plan-more{display:grid;gap:9px;margin-top:0;}
.pricing-cards-v28 .plan-more{max-height:0;opacity:0;overflow:hidden;transition:max-height .24s ease,opacity .18s ease,margin .18s ease;padding-top:0;}
.pricing-section.features-open .plan-more{max-height:360px;opacity:1;margin-top:8px;}
.pricing-cards-v28 .price-card li{font-size:15px;line-height:1.32;}
.pricing-cards-v28 .price-card .price-btn{margin-top:auto;}
.pricing-cards-v28 .price-card ul{padding-bottom:0;}
.pricing-cards-v28 .free-plan ul{opacity:1!important;}
.pricing-note{font-size:15px!important;}
/* Remove old compare-plan button area when v28 pricing is present. */
.pricing-section .hero-actions.center:has(a[href="pricing.html"]){display:none!important;}
/* Mobile header: below 500px logo, theme and language stay on one compact row; title sits below. */
@media(max-width:500px){
.site-header{position:sticky!important;top:0!important;height:auto!important;min-height:0!important;padding:6px 0 8px!important;}
.nav-shell{width:94vw!important;display:grid!important;grid-template-columns:54px 54px minmax(0,1fr)!important;grid-template-rows:auto auto!important;grid-template-areas:"logo theme lang" "title title title"!important;gap:8px 10px!important;align-items:center!important;justify-items:stretch!important;padding:4px 0!important;}
.brand{display:contents!important;}
.brand-logo{grid-area:logo!important;width:50px!important;height:50px!important;justify-self:center!important;align-self:center!important;}
.brand-text{grid-area:title!important;font-size:15px!important;line-height:1.05!important;text-align:center!important;justify-self:center!important;max-width:100%!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
.main-nav,.top-download,.version-badge{display:none!important;}
.nav-actions{display:contents!important;}
.theme-toggle{grid-area:theme!important;width:54px!important;height:48px!important;min-width:54px!important;border-radius:14px!important;padding:0!important;justify-content:center!important;align-self:center!important;}
.theme-toggle .theme-icon{font-size:22px!important;}
.theme-toggle .theme-text{display:none!important;}
.custom-language{grid-area:lang!important;min-width:0!important;width:100%!important;align-self:center!important;}
.language-select{grid-area:lang!important;width:100%!important;min-width:0!important;height:48px!important;}
.custom-language-button{height:48px!important;border-radius:14px!important;font-size:15px!important;padding:0 12px!important;}
.custom-language-current{min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;}
.custom-language-list{right:0!important;left:auto!important;min-width:100%!important;width:100%!important;max-height:62vh!important;}
.hero{padding-top:24px!important;}
}
@media(max-width:900px){.pricing-cards-v28{grid-template-columns:1fr!important}.pricing-cards-v28 .price-card{min-height:auto!important;}}
/* ===============================
V29 final polish: premium mono hero badges + cleaner pricing + footer
=============================== */
.hero-pills-v25 span,
body.theme-dark .hero-pills-v25 span{
background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(248,250,252,.86))!important;
border:1px solid rgba(37,99,235,.18)!important;
box-shadow:0 18px 48px rgba(15,23,42,.08)!important;
color:#0f172a!important;
}
body.theme-dark .hero-pills-v25 span{
background:linear-gradient(180deg,rgba(18,31,53,.94),rgba(10,20,36,.90))!important;
border-color:rgba(96,165,250,.22)!important;
color:#f8fbff!important;
box-shadow:0 20px 58px rgba(0,0,0,.22)!important;
}
.hero-pills-v25 i,
body.theme-dark .hero-pills-v25 i{
background:rgba(34,197,94,.14)!important;
color:#22c55e!important;
}
.hero-pills-v25 .highlight-pill,
.hero-pills-v25 .lifetime-pill,
body.theme-dark .hero-pills-v25 .highlight-pill,
body.theme-dark .hero-pills-v25 .lifetime-pill{
background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(248,250,252,.86))!important;
border-color:rgba(37,99,235,.18)!important;
}
body.theme-dark .hero-pills-v25 .highlight-pill,
body.theme-dark .hero-pills-v25 .lifetime-pill{
background:linear-gradient(180deg,rgba(18,31,53,.94),rgba(10,20,36,.90))!important;
border-color:rgba(96,165,250,.22)!important;
}
.hero-pills-v25 .lifetime-pill b{color:#7c3aed!important;}
body.theme-dark .hero-pills-v25 .lifetime-pill b{color:#c4b5fd!important;}
.pricing-cards-v29 .plan-core li,
.pricing-cards-v29 .plan-more li{font-size:14.5px!important;}
.pricing-cards-v29 .plan-more{border-top:1px solid rgba(100,116,139,.13);padding-top:0;}
.pricing-section.features-open .pricing-cards-v29 .plan-more{padding-top:10px;}
.pricing-cards-v29 .price-card{min-height:650px;}
.pricing-cards-v29 .price-card .plan-core{margin-top:18px;}
@media(max-width:900px){.pricing-cards-v29 .price-card{min-height:auto!important;}}
/* Footer without GitHub: keep the support column compact. */
.site-footer div:last-of-type a[href="#"]{display:none!important;}
/* Legal/document pages: richer readable copy. */
.legal-list{display:grid;gap:12px;margin-top:12px;padding-left:18px;color:inherit;}
.doc-card ul.legal-list li{line-height:1.55;}
.doc-page .doc-card.wide{grid-column:1 / -1;}
/* ===============================
V30 pricing toggles: every plan has a bottom toggle that controls all cards.
=============================== */
.plan-feature-toggle{
width:100%;
min-height:44px;
margin-top:12px;
border-radius:14px;
border:1px solid rgba(124,60,255,.22);
background:rgba(124,60,255,.075);
color:#5b21b6;
font-weight:1000;
font-size:14px;
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px;
cursor:pointer;
transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.plan-feature-toggle:hover{
transform:translateY(-1px);
background:rgba(124,60,255,.12);
border-color:rgba(124,60,255,.35);
box-shadow:0 10px 24px rgba(124,60,255,.08);
}
.plan-feature-toggle .toggle-arrow{font-size:18px;line-height:1;transition:transform .18s ease;}
.pricing-section.features-open .plan-feature-toggle .toggle-arrow{transform:rotate(180deg);}
body.theme-dark .plan-feature-toggle{background:rgba(124,60,255,.18);border-color:rgba(167,139,250,.32);color:#e9d5ff;}
body.theme-dark .plan-feature-toggle:hover{background:rgba(124,60,255,.26);}
@media(max-width:900px){
.features-toggle{display:none!important;}
.plan-feature-toggle{min-height:48px;font-size:15px;margin-top:14px;}
}
/* ===============================
V30.1 critical mobile viewport fix
Fixes the broken mobile layout where the hero uses only part of the screen
and leaves a blank vertical area on the right.
=============================== */
html,
body{
width:100%!important;
max-width:100%!important;
overflow-x:hidden!important;
}
main,
.site-header,
.nav-shell,
.section-wide,
.hero,
.hero-copy,
.app-frame,
.pricing-section,
.gallery-showcase,
.feature-cards,
.site-footer{
max-width:100%!important;
}
@media(max-width:900px){
:root{--page:calc(100vw - 28px)!important;}
.section-wide{
width:calc(100vw - 28px)!important;
max-width:calc(100vw - 28px)!important;
margin-left:auto!important;
margin-right:auto!important;
}
.hero{
display:block!important;
grid-template-columns:1fr!important;
width:calc(100vw - 28px)!important;
max-width:calc(100vw - 28px)!important;
min-height:auto!important;
padding-left:0!important;
padding-right:0!important;
}
.hero-copy,
.app-frame{
width:100%!important;
max-width:100%!important;
min-width:0!important;
}
.app-frame{
margin-top:28px!important;
justify-self:auto!important;
}
.hero h1,
.hero-subtitle,
.hero-language-note{
max-width:100%!important;
}
.hero-actions{
width:100%!important;
}
.hero-actions .btn{
max-width:100%!important;
}
.gallery-showcase,
.pricing-section,
.cta-panel{
width:calc(100vw - 28px)!important;
max-width:calc(100vw - 28px)!important;
}
}
@media(max-width:500px){
:root{--page:calc(100vw - 28px)!important;}
.site-header{
width:100%!important;
max-width:100%!important;
}
.nav-shell{
width:calc(100vw - 28px)!important;
max-width:calc(100vw - 28px)!important;
margin-left:auto!important;
margin-right:auto!important;
}
.hero{
padding-top:22px!important;
}
.hero-pills-v25,
.hero-pills{
width:100%!important;
max-width:100%!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
.hero-pills-v25 span,
.hero-pills span{
width:100%!important;
min-width:0!important;
max-width:none!important;
}
.hero-pills-v25 .lifetime-pill,
.hero-pills .lifetime-pill,
.hero-pills span:nth-child(5){
grid-column:1 / -1!important;
}
.app-preview-button,
.app-preview-button img{
width:100%!important;
max-width:100%!important;
}
}
@media(max-width:360px){
.hero-pills-v25,
.hero-pills{
grid-template-columns:1fr!important;
}
}
/* ===============================
V30.3 REAL MOBILE FIX
Based on V30.1. Keeps all V30/V30.1 content and only fixes mobile width.
=============================== */
@media (max-width: 768px) {
html, body {
width: 100% !important;
min-width: 0 !important;
max-width: 100% !important;
overflow-x: hidden !important;
}
body > *,
.site-header,
main,
footer,
.site-footer {
max-width: 100% !important;
}
.site-header {
left: 0 !important;
right: 0 !important;
width: 100% !important;
}
.nav-shell,
.section-wide,
.hero,
.gallery-showcase,
.feature-cards,
.pricing-section,
.accordion-grid,
.stats-strip,
.cta-panel,
.site-footer,
.doc-page,
.doc-hero,
.doc-grid,
.pricing-page-section {
width: 100% !important;
max-width: 100% !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
main > .section-wide,
.site-footer,
.doc-page {
padding-left: 16px !important;
padding-right: 16px !important;
}
.hero {
display: flex !important;
flex-direction: column !important;
grid-template-columns: none !important;
gap: 24px !important;
padding-top: 26px !important;
overflow: hidden !important;
}
.hero-copy,
.app-frame,
.app-preview-button,
.app-preview-button img,
#appPreviewImage {
width: 100% !important;
max-width: 100% !important;
min-width: 0 !important;
justify-self: stretch !important;
}
.hero h1,
.hero-subtitle,
.hero-language-note,
.trial-note {
width: 100% !important;
max-width: 100% !important;
}
.hero-actions {
width: 100% !important;
max-width: 100% !important;
display: grid !important;
grid-template-columns: 1fr !important;
gap: 12px !important;
}
.hero-actions .btn {
width: 100% !important;
max-width: 100% !important;
}
.hero-pills,
.hero-pills-v25 {
width: 100% !important;
max-width: 100% !important;
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 10px !important;
}
.hero-pills span,
.hero-pills-v25 span {
min-width: 0 !important;
max-width: 100% !important;
width: 100% !important;
}
.hero-pills .lifetime-pill,
.hero-pills-v25 .lifetime-pill,
.hero-pills span:nth-child(5),
.hero-pills-v25 span:nth-child(5) {
grid-column: 1 / -1 !important;
}
.translation-gallery,
.pricing-cards,
.pricing-cards-five,
.pricing-cards-v26,
.pricing-cards-v28,
.pricing-cards-v29,
.pricing-cards-v30 {
width: 100% !important;
max-width: 100% !important;
}
.gallery-showcase {
overflow: hidden !important;
}
.gallery-card {
flex-basis: min(86vw, 100%) !important;
max-width: 100% !important;
}
}
@media (max-width: 500px) {
.nav-shell {
width: 100% !important;
max-width: 100% !important;
padding-left: 14px !important;
padding-right: 14px !important;
margin: 0 !important;
}
.hero h1 {
font-size: clamp(34px, 10vw, 42px) !important;
}
.hero-subtitle {
font-size: 17px !important;
}
}
@media (max-width: 360px) {
.hero-pills,
.hero-pills-v25 {
grid-template-columns: 1fr !important;
}
.hero-pills .lifetime-pill,
.hero-pills-v25 .lifetime-pill,
.hero-pills span:nth-child(5),
.hero-pills-v25 span:nth-child(5) {
grid-column: auto !important;
}
}
/* ===============================
V31 pricing polish
- Free neutral/white
- 1 Month green, 6 Months blue, 1 Year purple, Lifetime gold
- Feature toggles are neutral and sit above plan CTA buttons
- When expanded, feature toggles collapse to arrow-only controls
=============================== */
.pricing-cards-v26 .price-card{background:#fff!important;color:#0f172a!important;}
body.theme-dark .pricing-cards-v26 .price-card{background:rgba(13,26,45,.92)!important;color:#f7f7ff!important;}
.plan-free{--plan-color:#64748b!important;border-color:rgba(100,116,139,.26)!important;}
.plan-month{--plan-color:#16a34a!important;border-color:rgba(22,163,74,.42)!important;box-shadow:0 0 0 1px rgba(22,163,74,.10),0 18px 56px rgba(22,163,74,.07)!important;}
.plan-six{--plan-color:#2563eb!important;border-color:rgba(37,99,235,.42)!important;box-shadow:0 0 0 1px rgba(37,99,235,.10),0 18px 56px rgba(37,99,235,.07)!important;}
.plan-year{--plan-color:#7c3aed!important;border-color:rgba(124,58,237,.48)!important;box-shadow:0 0 0 1px rgba(124,58,237,.14),0 22px 70px rgba(124,58,237,.10)!important;}
.plan-life{--plan-color:#facc15!important;border-color:rgba(250,204,21,.70)!important;box-shadow:0 0 0 1px rgba(250,204,21,.28),0 28px 90px rgba(250,204,21,.20)!important;}
.plan-free .plan-focus{background:rgba(100,116,139,.10)!important;border-color:rgba(100,116,139,.22)!important;color:#475569!important;}
.plan-month .plan-focus{background:rgba(22,163,74,.13)!important;border-color:rgba(22,163,74,.30)!important;color:#15803d!important;}
.plan-six .plan-focus{background:rgba(37,99,235,.12)!important;border-color:rgba(37,99,235,.30)!important;color:#1d4ed8!important;}
.plan-year .plan-focus{background:rgba(124,58,237,.13)!important;border-color:rgba(124,58,237,.30)!important;color:#6d28d9!important;}
.plan-life .plan-focus{background:linear-gradient(135deg,rgba(250,204,21,.22),rgba(245,158,11,.15))!important;border-color:rgba(250,204,21,.42)!important;color:#a16207!important;}
.plan-month .price-btn{background:linear-gradient(135deg,#16a34a,#22c55e)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 18px 45px rgba(22,163,74,.20)!important;}
.plan-six .price-btn{background:linear-gradient(135deg,#2563eb,#3b82f6)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 18px 45px rgba(37,99,235,.20)!important;}
.plan-year .price-btn{background:linear-gradient(135deg,#7c3aed,#a855f7)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 18px 45px rgba(124,58,237,.22)!important;}
.plan-life .price-btn{background:linear-gradient(135deg,#facc15,#f59e0b)!important;color:#111827!important;border-color:transparent!important;box-shadow:0 22px 60px rgba(250,204,21,.30)!important;}
body.theme-dark .plan-month .plan-focus{background:rgba(22,163,74,.22)!important;color:#bbf7d0!important;}
body.theme-dark .plan-six .plan-focus{background:rgba(37,99,235,.22)!important;color:#bfdbfe!important;}
body.theme-dark .plan-year .plan-focus{background:rgba(124,58,237,.24)!important;color:#ddd6fe!important;}
body.theme-dark .plan-life .plan-focus{background:linear-gradient(135deg,rgba(250,204,21,.25),rgba(245,158,11,.20))!important;color:#fef3c7!important;}
.plan-badge.subtle,.best-badge{background:color-mix(in srgb,var(--plan-color,#64748b) 14%, #fff)!important;color:color-mix(in srgb,var(--plan-color,#64748b) 70%, #111827)!important;}
body.theme-dark .plan-badge.subtle,body.theme-dark .best-badge{background:color-mix(in srgb,var(--plan-color,#64748b) 22%, rgba(15,23,42,.9))!important;color:#fff!important;}
/* Neutral show/hide feature buttons */
.features-toggle,
.plan-feature-toggle{
border:1px solid rgba(15,23,42,.14)!important;
background:rgba(15,23,42,.045)!important;
color:#1f2937!important;
box-shadow:none!important;
}
.features-toggle:hover,
.plan-feature-toggle:hover{
background:rgba(15,23,42,.075)!important;
border-color:rgba(15,23,42,.22)!important;
}
body.theme-dark .features-toggle,
body.theme-dark .plan-feature-toggle{
background:rgba(255,255,255,.06)!important;
border-color:rgba(255,255,255,.16)!important;
color:#e5e7eb!important;
}
body.theme-dark .features-toggle:hover,
body.theme-dark .plan-feature-toggle:hover{background:rgba(255,255,255,.10)!important;}
/* Toggle sits above the CTA and stays visually secondary */
.plan-feature-toggle{order:10;margin-top:auto!important;margin-bottom:12px!important;min-height:38px!important;font-size:13px!important;border-radius:12px!important;}
.price-btn{order:11;}
.price-card{display:flex!important;flex-direction:column!important;}
/* Expanded state: leave only a compact arrow to close. */
.pricing-section.features-open .plan-feature-toggle,
.pricing-section.features-open .features-toggle{
width:44px!important;
min-width:44px!important;
max-width:44px!important;
height:38px!important;
min-height:38px!important;
padding:0!important;
border-radius:999px!important;
margin-left:auto!important;
margin-right:auto!important;
}
.pricing-section.features-open .plan-feature-toggle span[data-i18n],
.pricing-section.features-open .features-toggle span[data-i18n]{display:none!important;}
.pricing-section.features-open .plan-feature-toggle .toggle-arrow,
.pricing-section.features-open .features-toggle .toggle-arrow{margin:0!important;font-size:20px!important;}
@media(max-width:900px){
.plan-feature-toggle{min-height:42px!important;margin-bottom:12px!important;font-size:14px!important;}
}
/* ===============================
V32 hero feature cards polish
- Single brand color for checks/icons
- Neutral text for all hero cards
- Lifetime stays highlighted, but with brand cyan instead of purple
=============================== */
:root{
--hero-brand-cyan:#0ea5e9;
--hero-brand-cyan-soft:rgba(14,165,233,.12);
--hero-brand-cyan-border:rgba(14,165,233,.24);
}
.hero-pills,
.hero-pills-v25{
grid-template-columns:repeat(2,minmax(250px,1fr))!important;
}
.hero-pills span,
.hero-pills-v25 span,
.hero-pills .highlight-pill,
.hero-pills .lifetime-pill,
.hero-pills-v25 .highlight-pill,
.hero-pills-v25 .lifetime-pill{
background:rgba(255,255,255,.82)!important;
border-color:rgba(148,163,184,.22)!important;
box-shadow:0 18px 48px rgba(15,23,42,.08)!important;
color:#0f172a!important;
}
.hero-pills span b,
.hero-pills-v25 span b,
.hero-pills .highlight-pill b,
.hero-pills-v25 .highlight-pill b{
color:#0f172a!important;
}
.hero-pills i,
.hero-pills-v25 i,
.hero-pills span i,
.hero-pills-v25 span i{
background:var(--hero-brand-cyan-soft)!important;
color:var(--hero-brand-cyan)!important;
}
.hero-pills .lifetime-pill,
.hero-pills-v25 .lifetime-pill{
grid-column:1 / -1!important;
background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(14,165,233,.07))!important;
border-color:var(--hero-brand-cyan-border)!important;
}
.hero-pills .lifetime-pill b,
.hero-pills-v25 .lifetime-pill b,
body.theme-dark .hero-pills .lifetime-pill b,
body.theme-dark .hero-pills-v25 .lifetime-pill b{
color:var(--hero-brand-cyan)!important;
}
body.theme-dark .hero-pills span,
body.theme-dark .hero-pills-v25 span,
body.theme-dark .hero-pills .highlight-pill,
body.theme-dark .hero-pills .lifetime-pill,
body.theme-dark .hero-pills-v25 .highlight-pill,
body.theme-dark .hero-pills-v25 .lifetime-pill{
background:rgba(15,23,42,.82)!important;
border-color:rgba(148,163,184,.20)!important;
box-shadow:0 18px 48px rgba(0,0,0,.18)!important;
color:#f8fafc!important;
}
body.theme-dark .hero-pills span b,
body.theme-dark .hero-pills-v25 span b,
body.theme-dark .hero-pills .highlight-pill b,
body.theme-dark .hero-pills-v25 .highlight-pill b{
color:#f8fafc!important;
}
body.theme-dark .hero-pills i,
body.theme-dark .hero-pills-v25 i,
body.theme-dark .hero-pills span i,
body.theme-dark .hero-pills-v25 span i{
background:rgba(14,165,233,.18)!important;
color:#38bdf8!important;
}
body.theme-dark .hero-pills .lifetime-pill,
body.theme-dark .hero-pills-v25 .lifetime-pill{
background:linear-gradient(135deg,rgba(15,23,42,.86),rgba(14,165,233,.10))!important;
border-color:rgba(14,165,233,.30)!important;
}
body.theme-dark .hero-pills .lifetime-pill b,
body.theme-dark .hero-pills-v25 .lifetime-pill b{
color:#38bdf8!important;
}
@media(max-width:900px){
.hero-pills,
.hero-pills-v25{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
.hero-pills .lifetime-pill,
.hero-pills-v25 .lifetime-pill{grid-column:1 / -1!important;}
}
@media(max-width:360px){
.hero-pills,
.hero-pills-v25{grid-template-columns:1fr!important;}
.hero-pills .lifetime-pill,
.hero-pills-v25 .lifetime-pill{grid-column:auto!important;}
}
/* ===============================
V33 pricing premium gradients
- Softer professional plan identity in light theme
- Stronger but controlled gradients in dark theme
- Brighter plan bars and CTA buttons
=============================== */
.pricing-cards-v26 .price-card{
isolation:isolate;
overflow:hidden;
transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.pricing-cards-v26 .price-card::after{
content:"";
position:absolute;
inset:0;
z-index:-1;
pointer-events:none;
opacity:1;
}
.pricing-cards-v26 .price-card:hover{
transform:translateY(-4px);
}
/* Light theme: soft, premium, not cartoon */
.pricing-cards-v26 .plan-free{
--plan-color:#64748b!important;
background:linear-gradient(135deg,rgba(100,116,139,.18) 0%,rgba(255,255,255,.98) 34%,#fff 100%)!important;
border-color:rgba(100,116,139,.34)!important;
box-shadow:0 22px 58px rgba(15,23,42,.08)!important;
}
.pricing-cards-v26 .plan-month{
--plan-color:#16a34a!important;
background:linear-gradient(135deg,rgba(22,163,74,.48) 0%,rgba(34,197,94,.20) 22%,rgba(255,255,255,.98) 58%,#fff 100%)!important;
border-color:rgba(22,163,74,.42)!important;
box-shadow:0 24px 72px rgba(22,163,74,.14)!important;
}
.pricing-cards-v26 .plan-six{
--plan-color:#2563eb!important;
background:linear-gradient(135deg,rgba(37,99,235,.50) 0%,rgba(59,130,246,.20) 24%,rgba(255,255,255,.98) 60%,#fff 100%)!important;
border-color:rgba(37,99,235,.44)!important;
box-shadow:0 24px 72px rgba(37,99,235,.14)!important;
}
.pricing-cards-v26 .plan-year{
--plan-color:#8b5cf6!important;
background:linear-gradient(135deg,rgba(139,92,246,.52) 0%,rgba(168,85,247,.20) 24%,rgba(255,255,255,.98) 62%,#fff 100%)!important;
border-color:rgba(139,92,246,.48)!important;
box-shadow:0 26px 78px rgba(139,92,246,.16)!important;
}
.pricing-cards-v26 .plan-life{
--plan-color:#facc15!important;
background:linear-gradient(135deg,rgba(250,204,21,.50) 0%,rgba(253,224,71,.24) 26%,rgba(255,255,255,.98) 64%,#fff 100%)!important;
border-color:rgba(250,204,21,.70)!important;
box-shadow:0 30px 90px rgba(250,204,21,.18)!important;
}
/* Dark theme: colored depth, center stays readable */
body.theme-dark .pricing-cards-v26 .plan-free{
background:
radial-gradient(circle at 8% 6%,rgba(148,163,184,.18),transparent 34%),
linear-gradient(180deg,rgba(15,29,49,.96),rgba(10,22,39,.96))!important;
border-color:rgba(148,163,184,.34)!important;
box-shadow:0 22px 62px rgba(0,0,0,.30)!important;
}
body.theme-dark .pricing-cards-v26 .plan-month{
background:
radial-gradient(circle at 8% 4%,rgba(34,197,94,.35),transparent 38%),
radial-gradient(circle at 94% 92%,rgba(22,163,74,.16),transparent 34%),
linear-gradient(180deg,rgba(12,31,39,.98),rgba(8,22,38,.98))!important;
border-color:rgba(22,163,74,.46)!important;
box-shadow:0 26px 78px rgba(22,163,74,.14),0 18px 56px rgba(0,0,0,.28)!important;
}
body.theme-dark .pricing-cards-v26 .plan-six{
background:
radial-gradient(circle at 9% 4%,rgba(37,99,235,.42),transparent 40%),
radial-gradient(circle at 92% 92%,rgba(59,130,246,.16),transparent 34%),
linear-gradient(180deg,rgba(10,27,53,.98),rgba(8,20,38,.98))!important;
border-color:rgba(37,99,235,.50)!important;
box-shadow:0 26px 78px rgba(37,99,235,.16),0 18px 56px rgba(0,0,0,.28)!important;
}
body.theme-dark .pricing-cards-v26 .plan-year{
background:
radial-gradient(circle at 9% 4%,rgba(139,92,246,.42),transparent 40%),
radial-gradient(circle at 92% 92%,rgba(168,85,247,.16),transparent 34%),
linear-gradient(180deg,rgba(22,20,55,.98),rgba(10,20,39,.98))!important;
border-color:rgba(139,92,246,.56)!important;
box-shadow:0 28px 84px rgba(139,92,246,.18),0 18px 56px rgba(0,0,0,.28)!important;
}
body.theme-dark .pricing-cards-v26 .plan-life{
background:
radial-gradient(circle at 8% 4%,rgba(250,204,21,.36),transparent 38%),
radial-gradient(circle at 94% 92%,rgba(245,158,11,.18),transparent 34%),
linear-gradient(180deg,rgba(33,31,24,.98),rgba(9,21,37,.98))!important;
border-color:rgba(250,204,21,.78)!important;
box-shadow:0 32px 98px rgba(250,204,21,.22),0 20px 58px rgba(0,0,0,.30)!important;
}
/* Brighter focus bars */
.pricing-cards-v26 .plan-free .plan-focus{
background:linear-gradient(135deg,#eef2f7,#f8fafc)!important;
color:#475569!important;
border-color:rgba(100,116,139,.22)!important;
}
.pricing-cards-v26 .plan-month .plan-focus{
background:linear-gradient(135deg,rgba(22,163,74,.20),rgba(34,197,94,.13))!important;
color:#15803d!important;
border-color:rgba(22,163,74,.30)!important;
}
.pricing-cards-v26 .plan-six .plan-focus{
background:linear-gradient(135deg,rgba(37,99,235,.18),rgba(59,130,246,.12))!important;
color:#1d4ed8!important;
border-color:rgba(37,99,235,.30)!important;
}
.pricing-cards-v26 .plan-year .plan-focus{
background:linear-gradient(135deg,rgba(139,92,246,.18),rgba(168,85,247,.12))!important;
color:#6d28d9!important;
border-color:rgba(139,92,246,.32)!important;
}
.pricing-cards-v26 .plan-life .plan-focus{
background:linear-gradient(135deg,rgba(250,204,21,.28),rgba(245,158,11,.18))!important;
color:#a16207!important;
border-color:rgba(250,204,21,.45)!important;
}
body.theme-dark .pricing-cards-v26 .plan-free .plan-focus{background:linear-gradient(135deg,rgba(148,163,184,.22),rgba(148,163,184,.12))!important;color:#e2e8f0!important;}
body.theme-dark .pricing-cards-v26 .plan-month .plan-focus{background:linear-gradient(135deg,rgba(22,163,74,.46),rgba(22,163,74,.25))!important;color:#d1fae5!important;}
body.theme-dark .pricing-cards-v26 .plan-six .plan-focus{background:linear-gradient(135deg,rgba(37,99,235,.50),rgba(37,99,235,.26))!important;color:#dbeafe!important;}
body.theme-dark .pricing-cards-v26 .plan-year .plan-focus{background:linear-gradient(135deg,rgba(139,92,246,.50),rgba(139,92,246,.28))!important;color:#ede9fe!important;}
body.theme-dark .pricing-cards-v26 .plan-life .plan-focus{background:linear-gradient(135deg,rgba(250,204,21,.58),rgba(245,158,11,.34))!important;color:#fff7d6!important;}
/* CTA buttons: aligned with the plan identity */
.pricing-cards-v26 .plan-free .price-btn{
background:linear-gradient(135deg,#f8fafc,#e5e7eb)!important;
color:#0f172a!important;
border-color:rgba(100,116,139,.22)!important;
box-shadow:0 14px 34px rgba(15,23,42,.08)!important;
}
.pricing-cards-v26 .plan-month .price-btn{background:linear-gradient(135deg,#16a34a,#22c55e)!important;box-shadow:0 18px 46px rgba(22,163,74,.22)!important;}
.pricing-cards-v26 .plan-six .price-btn{background:linear-gradient(135deg,#2563eb,#3b82f6)!important;box-shadow:0 18px 46px rgba(37,99,235,.24)!important;}
.pricing-cards-v26 .plan-year .price-btn{background:linear-gradient(135deg,#7c3aed,#b24cf6)!important;box-shadow:0 20px 52px rgba(139,92,246,.26)!important;}
.pricing-cards-v26 .plan-life .price-btn{background:linear-gradient(135deg,#facc15,#f59e0b)!important;color:#0f172a!important;box-shadow:0 22px 58px rgba(250,204,21,.34)!important;}
body.theme-dark .pricing-cards-v26 .plan-free .price-btn{background:linear-gradient(135deg,rgba(148,163,184,.55),rgba(100,116,139,.44))!important;color:#fff!important;border-color:rgba(255,255,255,.14)!important;}
body.theme-dark .pricing-cards-v26 .plan-month .price-btn{background:linear-gradient(135deg,#15803d,#22c55e)!important;}
body.theme-dark .pricing-cards-v26 .plan-six .price-btn{background:linear-gradient(135deg,#1d4ed8,#3b82f6)!important;}
body.theme-dark .pricing-cards-v26 .plan-year .price-btn{background:linear-gradient(135deg,#7c3aed,#b24cf6)!important;}
body.theme-dark .pricing-cards-v26 .plan-life .price-btn{background:linear-gradient(135deg,#facc15,#f59e0b)!important;color:#0f172a!important;}
/* Badges: clearer but still secondary */
.pricing-cards-v26 .plan-badge.subtle,
.pricing-cards-v26 .best-badge{
border:1px solid color-mix(in srgb,var(--plan-color,#64748b) 18%, transparent)!important;
box-shadow:0 8px 22px color-mix(in srgb,var(--plan-color,#64748b) 12%, transparent)!important;
}
body.theme-dark .pricing-cards-v26 .plan-badge.subtle,
body.theme-dark .pricing-cards-v26 .best-badge{
background:color-mix(in srgb,var(--plan-color,#64748b) 25%, rgba(15,23,42,.82))!important;
border-color:color-mix(in srgb,var(--plan-color,#64748b) 35%, transparent)!important;
}
@media(hover:hover){
.pricing-cards-v26 .plan-free:hover{box-shadow:0 28px 76px rgba(15,23,42,.12)!important;}
.pricing-cards-v26 .plan-month:hover{box-shadow:0 30px 88px rgba(22,163,74,.20)!important;}
.pricing-cards-v26 .plan-six:hover{box-shadow:0 30px 88px rgba(37,99,235,.20)!important;}
.pricing-cards-v26 .plan-year:hover{box-shadow:0 32px 92px rgba(139,92,246,.24)!important;}
.pricing-cards-v26 .plan-life:hover{box-shadow:0 34px 100px rgba(250,204,21,.28)!important;}
}
/* ===============================
V37 final brand polish
- new brand gradient for Lifetime hero badge
- gradient check icons in hero value cards
- keeps layout and translations unchanged
=============================== */
:root{
--mts-ai-gradient:linear-gradient(90deg,#7a3ef2 0%,#4b6cff 48%,#18b8ff 100%);
--mts-check-circle-light:linear-gradient(135deg,#eef8ff 0%,#dff2ff 54%,#eaf7ff 100%);
--mts-check-circle-dark:linear-gradient(135deg,rgba(22,88,135,.78) 0%,rgba(12,62,103,.72) 54%,rgba(14,165,233,.22) 100%);
}
.hero h1 span{
background:var(--mts-ai-gradient)!important;
-webkit-background-clip:text!important;
background-clip:text!important;
color:transparent!important;
}
.hero-pills i,
.hero-pills-v25 i,
.hero-pills span i,
.hero-pills-v25 span i,
body.theme-dark .hero-pills i,
body.theme-dark .hero-pills-v25 i,
body.theme-dark .hero-pills span i,
body.theme-dark .hero-pills-v25 span i{
width:52px!important;
min-width:52px!important;
height:52px!important;
border-radius:999px!important;
display:grid!important;
place-items:center!important;
position:relative!important;
font-size:0!important;
line-height:1!important;
font-style:normal!important;
background:var(--mts-check-circle-light)!important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.88),0 8px 26px rgba(14,165,233,.14)!important;
}
body.theme-dark .hero-pills i,
body.theme-dark .hero-pills-v25 i,
body.theme-dark .hero-pills span i,
body.theme-dark .hero-pills-v25 span i{
background:var(--mts-check-circle-dark)!important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 10px 30px rgba(14,165,233,.16)!important;
}
.hero-pills i::before,
.hero-pills-v25 i::before,
.hero-pills span i::before,
.hero-pills-v25 span i::before{
content:"✓";
font-size:34px;
font-weight:1000;
line-height:1;
background:var(--mts-ai-gradient)!important;
-webkit-background-clip:text!important;
background-clip:text!important;
color:transparent!important;
filter:drop-shadow(0 1px 0 rgba(255,255,255,.18));
}
.hero-pills .lifetime-pill b,
.hero-pills-v25 .lifetime-pill b,
body.theme-dark .hero-pills .lifetime-pill b,
body.theme-dark .hero-pills-v25 .lifetime-pill b{
display:inline-block!important;
background:var(--mts-ai-gradient)!important;
-webkit-background-clip:text!important;
background-clip:text!important;
color:transparent!important;
text-shadow:none!important;
}
.hero-pills .lifetime-pill,
.hero-pills-v25 .lifetime-pill{
background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(24,184,255,.09))!important;
border-color:rgba(24,184,255,.30)!important;
box-shadow:0 24px 68px rgba(24,184,255,.10)!important;
}
body.theme-dark .hero-pills .lifetime-pill,
body.theme-dark .hero-pills-v25 .lifetime-pill{
background:linear-gradient(135deg,rgba(10,23,43,.92),rgba(15,54,94,.58),rgba(9,23,43,.92))!important;
border-color:rgba(24,184,255,.32)!important;
box-shadow:0 22px 70px rgba(14,165,233,.16)!important;
}
@media(max-width:520px){
.hero-pills i,
.hero-pills-v25 i,
.hero-pills span i,
.hero-pills-v25 span i,
body.theme-dark .hero-pills i,
body.theme-dark .hero-pills-v25 i,
body.theme-dark .hero-pills span i,
body.theme-dark .hero-pills-v25 span i{
width:44px!important;
min-width:44px!important;
height:44px!important;
}
.hero-pills i::before,
.hero-pills-v25 i::before,
.hero-pills span i::before,
.hero-pills-v25 span i::before{font-size:29px!important;}
}
/* v38 conversion-first layout: show proof before feature list */
@media (min-width: 769px){
#gallery{margin-top:28px;}
#pricing{margin-top:54px;}
#features{margin-top:54px;}
}
/* v38 mobile order: title -> CTA -> app preview -> translation examples -> pricing -> features */
@media (max-width: 768px){
.hero{
display:flex!important;
flex-direction:column!important;
gap:18px!important;
padding:28px 0 18px!important;
}
.hero-copy{display:contents!important;}
.hero h1{order:1!important;}
.hero-subtitle{order:2!important;}
.hero-actions{order:3!important;margin-top:18px!important;}
.trial-note{order:4!important;margin-top:4px!important;}
.app-frame{order:5!important;width:100%!important;max-width:100%!important;margin-top:8px!important;}
.hero-pills{
order:6!important;
margin-top:16px!important;
display:grid!important;
grid-template-columns:1fr 1fr!important;
gap:12px!important;
width:100%!important;
}
.hero-pills span{
width:auto!important;
min-height:74px!important;
justify-content:flex-start!important;
padding:14px 12px!important;
}
.hero-pills .lifetime-pill{
grid-column:1 / -1!important;
}
.hero-language-note{order:7!important;margin-top:8px!important;}
#gallery{margin-top:24px!important;}
#pricing{margin-top:34px!important;}
#features{margin-top:34px!important;}
}
@media (max-width: 480px){
.hero-actions{gap:12px!important;}
.hero-pills{grid-template-columns:1fr 1fr!important;gap:10px!important;}
.hero-pills span{min-height:66px!important;}
.hero-pills b{font-size:16px!important;line-height:1.15!important;}
.app-frame{border-radius:18px!important;}
}
/* ===============================
V39 mobile conversion order
Keep hero benefit pills after pricing on mobile.
=============================== */
.mobile-hero-pills{display:none;}
@media (max-width: 768px){
.hero > .hero-copy > .hero-pills,
.hero > .hero-copy > .hero-language-note,
.hero .hero-pills,
.hero .hero-language-note{
display:none!important;
}
.mobile-hero-pills{
display:block!important;
margin-top:28px!important;
margin-bottom:10px!important;
}
.mobile-hero-pills-grid{
display:grid!important;
grid-template-columns:1fr 1fr!important;
gap:12px!important;
width:100%!important;
margin-top:0!important;
}
.mobile-hero-pills-grid span{
width:auto!important;
min-height:74px!important;
justify-content:flex-start!important;
padding:14px 12px!important;
}
.mobile-hero-pills-grid .lifetime-pill{
grid-column:1 / -1!important;
}
.mobile-hero-language-note{
display:block!important;
margin-top:14px!important;
margin-bottom:0!important;
}
#pricing{margin-bottom:0!important;}
#features{margin-top:30px!important;}
}
@media (max-width: 480px){
.mobile-hero-pills-grid{gap:10px!important;}
.mobile-hero-pills-grid span{min-height:66px!important;}
.mobile-hero-pills-grid b{font-size:16px!important;line-height:1.15!important;}
}
/* ===============================
V41 micro-polish
Fixed theme-toggle geometry, symmetric pricing borders,
softer dark gradients and a neutral grey Free CTA.
=============================== */
.theme-toggle{
width:150px!important;
min-width:150px!important;
height:54px!important;
padding:0 18px!important;
gap:12px!important;
justify-content:flex-start!important;
overflow:hidden!important;
}
.theme-toggle .theme-icon{
width:28px!important;
min-width:28px!important;
height:28px!important;
display:inline-grid!important;
place-items:center!important;
line-height:1!important;
text-align:center!important;
}
.theme-toggle .theme-text{
width:74px!important;
min-width:74px!important;
text-align:left!important;
white-space:nowrap!important;
}
/* Every pricing card uses the same one-pixel outline. */
.pricing-cards-v26 .price-card,
.pricing-cards-v28 .price-card,
.pricing-cards-v29 .price-card,
.pricing-cards-five .price-card,
.pricing-cards-v26 .lifetime-card{
border-width:1px!important;
}
/* Light theme: soft colour washes that fade naturally into white. */
body:not(.theme-dark) .pricing-cards-v26 .plan-free{
background:
radial-gradient(110% 82% at 0% 0%,rgba(100,116,139,.24) 0%,rgba(148,163,184,.10) 34%,rgba(255,255,255,.98) 72%)!important;
box-shadow:0 24px 72px rgba(100,116,139,.10)!important;
}
body:not(.theme-dark) .pricing-cards-v26 .plan-month{
background:radial-gradient(110% 82% at 0% 0%,rgba(34,197,94,.30) 0%,rgba(34,197,94,.10) 36%,rgba(255,255,255,.98) 74%)!important;
}
body:not(.theme-dark) .pricing-cards-v26 .plan-six{
background:radial-gradient(110% 82% at 0% 0%,rgba(59,130,246,.30) 0%,rgba(59,130,246,.10) 36%,rgba(255,255,255,.98) 74%)!important;
}
body:not(.theme-dark) .pricing-cards-v26 .plan-year{
background:radial-gradient(110% 82% at 0% 0%,rgba(168,85,247,.30) 0%,rgba(168,85,247,.10) 36%,rgba(255,255,255,.98) 74%)!important;
}
body:not(.theme-dark) .pricing-cards-v26 .plan-life{
background:radial-gradient(110% 82% at 0% 0%,rgba(250,204,21,.33) 0%,rgba(250,204,21,.11) 38%,rgba(255,255,255,.98) 75%)!important;
}
/* Free trial button: visible neutral-grey gradient instead of flat white. */
.plan-free .price-btn{
background:linear-gradient(135deg,#aeb5bf 0%,#d5d9df 48%,#eef0f3 100%)!important;
color:#111827!important;
border-color:rgba(100,116,139,.30)!important;
box-shadow:0 16px 38px rgba(71,85,105,.16)!important;
}
.plan-free .price-btn:hover{
background:linear-gradient(135deg,#9fa7b2 0%,#cbd0d7 48%,#e6e9ed 100%)!important;
}
/* Dark theme: broad, low-opacity washes matching the softness of Light. */
body.theme-dark .pricing-cards-v26 .price-card{
border-width:1px!important;
box-shadow:0 24px 86px rgba(0,0,0,.22)!important;
}
body.theme-dark .pricing-cards-v26 .plan-free{
background:radial-gradient(120% 88% at 0% 0%,rgba(148,163,184,.17) 0%,rgba(30,41,59,.30) 37%,rgba(10,24,42,.96) 76%)!important;
border-color:rgba(148,163,184,.34)!important;
}
body.theme-dark .pricing-cards-v26 .plan-month{
background:radial-gradient(120% 88% at 0% 0%,rgba(34,197,94,.22) 0%,rgba(13,82,57,.22) 37%,rgba(8,27,39,.97) 77%)!important;
border-color:rgba(34,197,94,.38)!important;
box-shadow:0 26px 96px rgba(34,197,94,.08)!important;
}
body.theme-dark .pricing-cards-v26 .plan-six{
background:radial-gradient(120% 88% at 0% 0%,rgba(59,130,246,.23) 0%,rgba(30,64,175,.20) 37%,rgba(9,24,48,.97) 77%)!important;
border-color:rgba(59,130,246,.40)!important;
box-shadow:0 26px 96px rgba(59,130,246,.08)!important;
}
body.theme-dark .pricing-cards-v26 .plan-year{
background:radial-gradient(120% 88% at 0% 0%,rgba(168,85,247,.24) 0%,rgba(88,28,135,.19) 37%,rgba(19,18,51,.97) 77%)!important;
border-color:rgba(168,85,247,.43)!important;
box-shadow:0 26px 96px rgba(168,85,247,.08)!important;
}
body.theme-dark .pricing-cards-v26 .plan-life{
background:radial-gradient(120% 88% at 0% 0%,rgba(250,204,21,.25) 0%,rgba(161,98,7,.18) 38%,rgba(25,28,30,.97) 78%)!important;
border-color:rgba(250,204,21,.52)!important;
box-shadow:0 28px 105px rgba(250,204,21,.09)!important;
}
body.theme-dark .plan-free .price-btn{
background:linear-gradient(135deg,#66717f 0%,#8d96a2 48%,#b2b9c2 100%)!important;
color:#fff!important;
border-color:rgba(203,213,225,.22)!important;
box-shadow:0 16px 40px rgba(0,0,0,.22)!important;
}
@media(max-width:900px){
.theme-toggle{
width:54px!important;
min-width:54px!important;
height:48px!important;
padding:0!important;
justify-content:center!important;
}
.theme-toggle .theme-icon{width:28px!important;min-width:28px!important;}
.theme-toggle .theme-text{display:none!important;}
}
@media(max-width:500px){
.theme-toggle{width:64px!important;min-width:64px!important;height:50px!important;}
}