/*
Theme Name: Tab Demo Site
Description: One-place demo + sales site for Tab Ultimate. Edit everything in Settings → Tab Demo Site.
Version: 1.0.0
Text Domain: tab-demo-site
*/
:root{--ink:#16110d;--cream:#fff6e5;--red:#ff5a36;--lilac:#c3b0ff;--lime:#d3f542;--sky:#8fd3ff;--b:3px solid var(--ink);--sh:6px 6px 0 var(--ink)}
*{box-sizing:border-box;margin:0}
body{background:var(--cream);color:var(--ink);font:17px/1.6 "Trebuchet MS",Verdana,system-ui,sans-serif;background-image:radial-gradient(#16110d22 1.2px,transparent 1.2px);background-size:22px 22px}
a{color:inherit}h1,h2,h3{font-family:Georgia,"Times New Roman",serif;line-height:1.05;letter-spacing:-.02em}
.w{max-width:1120px;margin:0 auto;padding:0 22px}
mark{background:var(--lime);padding:0 .15em;border:var(--b);border-radius:10px;display:inline-block;transform:rotate(-1.5deg)}
.btn{display:inline-block;padding:14px 26px;border:var(--b);border-radius:14px;background:var(--red);color:#fff;font-weight:800;text-decoration:none;box-shadow:var(--sh);transition:.15s}
.btn:hover{transform:translate(3px,3px);box-shadow:3px 3px 0 var(--ink)}.btn.alt{background:#fff;color:var(--ink)}
header.top{border-bottom:var(--b);background:var(--lilac)}header.top .w{display:flex;justify-content:space-between;align-items:center;height:70px}
.logo{font:900 24px Georgia,serif;text-decoration:none}.logo span{background:var(--ink);color:var(--lime);padding:0 8px;border-radius:8px;margin-right:6px}
header.top nav a{margin-left:22px;font-weight:800;text-decoration:none}header.top nav a:hover{text-decoration:underline wavy}
.hero{padding:84px 0 70px;text-align:center;position:relative}
.hero h1{font-size:clamp(42px,7vw,86px);max-width:900px;margin:0 auto 22px}
.hero p{font-size:20px;max-width:620px;margin:0 auto 32px}.hero .btn{margin:6px 8px}
.sticker{position:absolute;border:var(--b);border-radius:50%;display:grid;place-items:center;text-align:center;font:900 15px Georgia,serif;box-shadow:var(--sh)}
.s1{width:120px;height:120px;background:var(--sky);top:40px;left:4%;transform:rotate(-12deg)}.s2{width:104px;height:104px;background:var(--lime);bottom:30px;right:6%;transform:rotate(10deg)}
.mq{border-block:var(--b);background:var(--ink);color:var(--lime);overflow:hidden;white-space:nowrap;font:900 20px Georgia,serif;padding:12px 0}
.mq div{display:inline-block;animation:mq 25s linear infinite}@keyframes mq{to{transform:translateX(-50%)}}
section{padding:84px 0}h2.t{font-size:clamp(34px,5vw,56px);margin-bottom:12px}.sub{max-width:600px;margin-bottom:44px;font-size:19px}
.demo{background:#fff;border:var(--b);border-radius:22px;box-shadow:var(--sh);padding:26px;margin-bottom:38px;position:relative}
.demo>b{position:absolute;top:-17px;left:22px;background:var(--red);color:#fff;border:var(--b);border-radius:10px;padding:2px 14px;font-weight:900;transform:rotate(-2deg)}
.demo:nth-child(2)>b{background:var(--lilac);color:var(--ink)}.demo:nth-child(3)>b{background:var(--lime);color:var(--ink)}
.demo .empty{padding:24px;border:2px dashed var(--ink);border-radius:14px;text-align:center}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.card{background:#fff;border:var(--b);border-radius:20px;box-shadow:var(--sh);padding:26px;transition:.2s}
.card:hover{transform:rotate(-1.2deg) translateY(-6px)}.card:nth-child(3n+2){background:var(--sky)}.card:nth-child(3n){background:var(--lime)}
.card i{font-style:normal;font-size:34px;display:block;margin-bottom:8px}.card h3{font-size:24px;margin-bottom:6px}
.plans{display:grid;grid-template-columns:1fr 1fr;gap:30px;max-width:880px}
.plan{background:#fff;border:var(--b);border-radius:24px;box-shadow:var(--sh);padding:34px}.plan.pro{background:var(--lilac);transform:rotate(1deg)}
.plan .p{font:900 54px Georgia,serif}.plan ul{list-style:none;padding:0;margin:18px 0 26px}.plan li{padding:6px 0;border-bottom:2px dotted var(--ink)}.plan li:before{content:"✱ ";color:var(--red);font-weight:900}
.cta{background:var(--red);color:#fff;border-block:var(--b);text-align:center;padding:84px 0}.cta h2{font-size:clamp(34px,5vw,60px);margin-bottom:22px}.cta .btn{background:var(--lime);color:var(--ink)}
footer.bot{padding:30px 0;font-weight:700}footer.bot .w{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
@media(max-width:860px){.grid,.plans{grid-template-columns:1fr}.sticker{display:none}header.top nav a:not(:last-child){display:none}}
.hero .g{font-size:15px;font-weight:800;margin:18px 0 0}
.proof{background:var(--lime);border-block:var(--b)}.proof .w{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding-block:20px;text-align:center}
.proof b{display:block;font:900 32px Georgia,serif}.proof span{font-weight:800;font-size:14px}
.sandbox{padding:0 0 84px}.sandbox .box{display:flex;align-items:center;justify-content:space-between;gap:26px;flex-wrap:wrap;background:var(--sky);border:var(--b);border-radius:26px;box-shadow:var(--sh);padding:38px}
.sandbox h2{font-size:clamp(28px,4vw,44px);margin-bottom:8px}.sandbox p{max-width:560px}
.cmp{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:var(--b);border-radius:20px;box-shadow:var(--sh);overflow:hidden}
.cmp th,.cmp td{padding:14px 18px;border-bottom:2px dotted var(--ink);text-align:center}.cmp th:first-child,.cmp td:first-child{text-align:left;font-weight:700}
.cmp th{font:900 20px Georgia,serif;background:var(--cream)}.cmp .pro{background:var(--lilac);font-weight:800}.cmp tr:last-child td{border-bottom:0}
figure.card blockquote{font:700 20px/1.4 Georgia,serif;margin-bottom:14px}
.q{background:#fff;border:var(--b);border-radius:16px;box-shadow:4px 4px 0 var(--ink);margin-bottom:16px;padding:6px 22px}
.q summary{cursor:pointer;font-weight:900;padding:14px 0;list-style:none}.q summary:after{content:"+";float:right;font-size:24px}.q[open] summary:after{content:"–"}.q p{padding-bottom:16px}
.cta .btn.alt{margin-left:8px}
.buybar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;justify-content:center;align-items:center;gap:18px;padding:10px 16px;background:var(--ink);color:var(--lime);font-weight:800}.buybar .btn{padding:8px 18px;box-shadow:none}
body{padding-bottom:62px}
@media(max-width:860px){.proof .w{grid-template-columns:1fr 1fr}.buybar span{display:none}}
/* Documentation page */
.docs-wrap{padding-top:10px}.docs-wrap .docs{margin-top:0}