/* MAVERICK · «Реклама» — світла тема поверх styles.css. Палітра — у styles.css (html.theme-light). */

/* ---------- light versions of shared components ---------- */
.theme-light .glass{background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(255,255,255,.58));box-shadow:inset 0 1px 0 #fff,0 24px 60px -32px rgba(48,36,110,.35)}
.theme-light .nav .bar{background:rgba(255,255,255,.7)}
.theme-light .modes,.theme-light .lang,.theme-light .mode,.theme-light .dtabs{background:rgba(27,21,48,.05)}
.theme-light .dtab .prog{background:rgba(27,21,48,.08)}
.theme-light .marquee{background:rgba(255,255,255,.45)}
.theme-light .tags span{background:rgba(27,21,48,.04)}
.theme-light .prow.head{background:rgba(27,21,48,.04)}
.theme-light .prow:hover{background:rgba(27,21,48,.025)}
.theme-light .form input[type=text],.theme-light .form textarea,.theme-light .form select{background:#fff}
.theme-light .form select option{background:#fff}
.theme-light .modal.open{background:rgba(27,21,48,.35)}
.theme-light .modal .sheet{background:linear-gradient(180deg,#fff,#f6f4fb)}
.theme-light .cookie{background:linear-gradient(135deg,#fff,#f3f0fb);box-shadow:0 0 0 6px color-mix(in srgb,var(--pink) 12%,transparent),0 24px 70px -20px rgba(48,36,110,.4)}
.theme-light .err{color:#d43a63}
.theme-light .btn-main{box-shadow:0 10px 30px -10px rgba(91,91,240,.55),inset 0 1px 0 #fff6}
.theme-light .btn-main:hover{box-shadow:0 16px 40px -12px rgba(91,91,240,.7),inset 0 1px 0 #fff6}
.theme-light .hero h1 .soft{color:var(--text)}
.theme-light .bg i{opacity:.7}
.theme-light .bg::after{opacity:.035}
.theme-light .ripple{background:rgba(91,91,240,.25)}
.theme-light .finger{background:radial-gradient(circle,rgba(27,21,48,.35) 0 30%,rgba(27,21,48,.14) 31% 60%,transparent 61%);box-shadow:0 0 0 1px rgba(27,21,48,.25)}
.theme-light .toast{background:rgba(255,255,255,.92);box-shadow:0 18px 40px -18px rgba(48,36,110,.45)}

/* ---------- platforms ---------- */
.plat{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.plat article .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:12px}
.plat .ico svg{color:#fff}
.plat .p-google .ico{background:linear-gradient(135deg,#4285f4,#34a853)}
.plat .p-meta .ico{background:linear-gradient(135deg,#0866ff,#a24dff)}
.plat .p-tiktok .ico{background:linear-gradient(135deg,#111,#25f4ee 140%)}
.plat .p-analytics .ico{background:linear-gradient(135deg,#f9ab00,#e37400)}
.plat .ico{border:0;box-shadow:0 10px 24px -12px rgba(48,36,110,.6)}

/* ---------- prices: 3 columns ---------- */
.adsp .prow{grid-template-columns:minmax(0,1.8fr) minmax(0,1fr) minmax(0,.7fr)}
.adsp .prow .v b{font-family:var(--f-display);font-size:15.5px;color:var(--text)}
.adsp .prow .v b small{display:inline;font-size:12.5px;color:var(--text-3);margin-left:2px}
@media (max-width:680px){.adsp .prow{grid-template-columns:1fr 1fr}}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:10px;max-width:860px}
.faq details{border-radius:var(--r);padding:0 20px;transition:background .25s}
.faq summary{list-style:none;cursor:pointer;padding:18px 34px 18px 0;font-family:var(--f-display);font-weight:700;font-size:16.5px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:50%;width:26px;height:26px;margin-top:-13px;border-radius:50%;display:grid;place-items:center;background:var(--btn);color:var(--on-accent);font-size:17px;font-weight:600;transition:transform .35s var(--spring)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--text-2);font-size:15px;padding:0 0 18px;max-width:46em;animation:bubIn .35s var(--ease) both}

/* ---------- demo screen ---------- */
.theme-light .screen{background:#fff;border-color:rgba(27,21,48,.1)}
.screen .caret{background:#4285f4}

/* Google */
.ad-g{background:#fff;color:#202124;font-family:Arial,var(--f-body);padding:16px 14px;gap:12px}
.g-top{display:flex;flex-direction:column;gap:12px;align-items:center}
.g-logo{font-family:var(--f-display);font-size:30px;letter-spacing:-.04em}
.g-bar{width:100%;display:flex;align-items:center;gap:10px;border:1px solid #dfe1e5;border-radius:999px;padding:11px 16px;font-size:15px;box-shadow:0 1px 6px rgba(32,33,36,.18);min-height:46px}
.g-bar svg{width:18px;height:18px;color:#9aa0a6;flex:none}
.g-res{display:flex;flex-direction:column;gap:14px;overflow:hidden}
.g-ad{display:flex;flex-direction:column;gap:5px;animation:bubIn .5s var(--ease) both}
.g-src{display:flex;gap:10px;align-items:center;font-size:13px}
.g-src small{display:block;color:#4d5156;font-size:12px}
.fav{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#1a73e8,#7c4dff);color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;flex:none}
.g-spons{font-size:12.5px;font-weight:700;color:#202124}
.g-h{color:#1a0dab;font-size:18px;line-height:1.3;cursor:pointer;text-decoration:none}
.g-h.hit{text-decoration:underline}
.g-ad p{font-size:13.5px;color:#4d5156;line-height:1.45}
.g-sl{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.g-sl span{font-size:13px;color:#1a0dab;border:1px solid #dadce0;border-radius:999px;padding:5px 11px}
.g-org{display:grid;grid-template-columns:28px 1fr;gap:4px 10px;opacity:.75;animation:bubIn .5s var(--ease) both;animation-delay:.25s}
.g-org i{grid-row:span 3;width:28px;height:28px;border-radius:50%;background:#f1f3f4}
.g-org b{font-weight:400;color:#1a0dab;font-size:15px}
.g-org span{height:8px;border-radius:4px;background:#f1f3f4}
.g-org span:last-child{width:70%}
.g-lp{position:absolute;inset:auto 0 0 0;height:62%;background:linear-gradient(180deg,#f8f9ff,#fff);border-top:1px solid #e3e6ff;border-radius:22px 22px 0 0;padding:18px 18px 20px;display:flex;flex-direction:column;gap:14px;box-shadow:0 -20px 50px -20px rgba(26,115,232,.35);transform:translateY(105%);transition:transform .6s var(--spring)}
.g-lp.on{transform:none}
.lp-head{display:flex;align-items:center;gap:8px;font-size:14px}
.g-lp h4{font-family:var(--f-display);font-size:21px;line-height:1.15;color:#1b1530}
.lp-field{border:1.5px solid #1a73e8;border-radius:12px;padding:12px 14px;font-size:16px;min-height:48px;display:flex;align-items:center;box-shadow:0 0 0 4px rgba(26,115,232,.12)}
.g-lp button,.ig-form button{border:0;border-radius:12px;padding:13px;font-weight:700;font-size:15px;color:#fff;background:linear-gradient(135deg,#4c8dff,#6a5cff);transition:transform .2s,background .3s}
.g-lp button.done,.ig-form button.done{background:#12a874}
button.hit{transform:scale(.97)}

/* Instagram */
.ad-ig{background:#fff;color:#111;font-size:13px}
.ig-top{display:flex;justify-content:space-between;align-items:center;padding:12px 14px 8px}
.ig-top b{font-family:'Brush Script MT','Segoe Script',cursive;font-size:24px;font-weight:400}
.ig-top span{font-size:17px;letter-spacing:6px}
.ig-stories{display:flex;gap:10px;padding:2px 14px 10px;border-bottom:1px solid #efefef}
.ig-stories i{width:44px;height:44px;border-radius:50%;flex:none;background:#f2f2f2;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--c)}
.ig-post{display:flex;flex-direction:column;flex:1;min-height:0}
.ig-u{display:flex;align-items:center;gap:9px;padding:9px 12px}
.ig-u .av{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#1b1530,#5b5bf0);color:#fff;display:grid;place-items:center;font-weight:800;font-size:13px}
.ig-u small{display:block;color:#737373;font-size:11.5px}
.ig-u .dots{margin-left:auto;color:#737373}
.ig-img{position:relative;flex:1;min-height:150px;background:radial-gradient(120% 90% at 20% 10%,#ffd3a5 0%,#fd6585 45%,#7b2ff7 100%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#fff;text-align:center;overflow:hidden}
.ig-img .sc{font-size:46px;animation:ckBob 2.4s ease-in-out infinite}
.ig-img b{font-family:var(--f-display);font-size:24px;line-height:1.1;max-width:12em;text-shadow:0 4px 20px rgba(0,0,0,.25)}
.ig-img .heart{position:absolute;font-size:90px;color:#fff;opacity:0;transform:scale(.3)}
.ig-img.liked .heart{animation:igHeart 1s var(--spring) forwards}
@keyframes igHeart{40%{opacity:.95;transform:scale(1.1)}70%{opacity:.95;transform:scale(1)}100%{opacity:0;transform:scale(1)}}
.ig-cta{display:flex;justify-content:space-between;padding:10px 12px;font-weight:700;color:#0095f6;border-bottom:1px solid #efefef;transition:background .4s,color .4s}
.ig-cta.lit{background:#0095f6;color:#fff}
.ig-act{display:flex;gap:14px;align-items:center;padding:8px 12px 2px;font-size:19px}
.ig-act .lk.on{color:#ff3040;animation:igPop .4s var(--spring)}
@keyframes igPop{50%{transform:scale(1.35)}}
.ig-act .likes{margin-left:auto;font-size:13px}
.ig-cap{padding:4px 12px 12px;line-height:1.4}
.ig-form{position:absolute;inset:auto 0 0 0;background:#fff;border-radius:20px 20px 0 0;padding:10px 18px 20px;display:flex;flex-direction:column;gap:12px;box-shadow:0 -20px 50px -10px rgba(0,0,0,.25);transform:translateY(105%);transition:transform .6s var(--spring)}
.ig-form.on{transform:none}
.ig-form .grab{width:38px;height:4px;border-radius:2px;background:#dbdbdb;align-self:center}
.ig-form b{font-size:16px}
.ig-form label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:#737373}
.ig-form .v{border:1px solid #dbdbdb;border-radius:10px;padding:11px 12px;font-size:15px;color:#111;min-height:44px}

/* TikTok */
.ad-tt{background:#000;color:#fff;overflow:hidden}
.tt-bg{position:absolute;inset:0;background:radial-gradient(90% 60% at 50% 30%,#ff8a3d 0%,#e2342d 45%,#3a0a0a 100%)}
.tt-bg span{position:absolute;font-size:70px;filter:drop-shadow(0 10px 20px rgba(0,0,0,.4))}
.tt-bg span:nth-child(1){left:12%;top:16%}
.tt-bg span:nth-child(2){right:14%;top:34%;font-size:54px}
.tt-bg span:nth-child(3){left:30%;top:52%;font-size:40px}
.ad-tt.play .tt-bg span{animation:ttFloat 3s ease-in-out infinite alternate}
.ad-tt.play .tt-bg span:nth-child(2){animation-delay:-1s}
.ad-tt.play .tt-bg span:nth-child(3){animation-delay:-2s}
@keyframes ttFloat{to{transform:translateY(-18px) rotate(14deg) scale(1.08)}}
.tt-tabs{position:relative;display:flex;justify-content:center;gap:18px;padding:14px;font-size:14px;color:#ffffffb0}
.tt-tabs b{color:#fff;border-bottom:2px solid #fff;padding-bottom:4px}
.tt-txt{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:24%;font-family:var(--f-display);text-align:center}
.tt-txt b{background:#fff;color:#111;padding:4px 12px;border-radius:8px;font-size:21px;opacity:0;transform:translateY(12px) scale(.9)}
.ad-tt.play .tt-txt b{animation:ttIn .5s var(--spring) forwards}
.ad-tt.play .tt-txt b:nth-child(2){animation-delay:.6s;background:#25f4ee}
@keyframes ttIn{to{opacity:1;transform:none}}
.tt-side{position:absolute;right:10px;bottom:120px;display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}
.tt-side .av{width:42px;height:42px;border-radius:50%;background:#fff;color:#e2342d;font-weight:800;display:grid;place-items:center;border:2px solid #fff}
.tt-side i{font-style:normal;font-size:26px;display:block;line-height:1}
.tt-side small{font-size:11.5px;font-weight:700}
.tt-cap{position:absolute;left:12px;right:70px;bottom:22px;font-size:13px;display:flex;flex-direction:column;gap:4px}
.tt-cap .sp{font-size:11px;background:#ffffff30;border-radius:4px;padding:1px 6px;align-self:flex-start}
.tt-cap p{color:#ffffffd0;line-height:1.35}
.tt-cta{margin-top:6px;background:#ffffff30;border-radius:6px;padding:9px 12px;font-weight:700;text-align:center;transition:background .5s,transform .3s}
.tt-cta.lit{background:#fe2c55;transform:scale(1.02)}
.tt-prog{position:absolute;left:0;right:0;bottom:0;height:3px;background:#ffffff30}
.tt-prog i{display:block;height:100%;width:0;background:#fff}
.ad-tt.play .tt-prog i{width:100%;transition:width 8s linear}

/* Report */
.ad-rp{background:linear-gradient(180deg,#f7f6fd,#fff);color:#1b1530;padding:16px 14px;gap:14px}
.rp-h{display:flex;justify-content:space-between;align-items:baseline}
.rp-h b{font-family:var(--f-display);font-size:18px}
.rp-h span{font-size:11.5px;color:#7d7893}
.rp-k{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.rp-k div{background:#fff;border:1px solid rgba(27,21,48,.08);border-radius:14px;padding:10px 12px;display:flex;flex-direction:column;gap:2px;box-shadow:0 8px 20px -16px rgba(48,36,110,.5)}
.rp-k small{color:#7d7893;font-size:11.5px}
.rp-k b{font-family:var(--f-display);font-size:21px}
.rp-k em{font-style:normal;font-size:11.5px;font-weight:700}
.rp-k em.up{color:#12a874}.rp-k em.down{color:#12a874}
.rp-chart{position:relative;display:flex;align-items:flex-end;gap:8px;height:130px;padding:8px 4px 20px;background:#fff;border:1px solid rgba(27,21,48,.08);border-radius:14px}
.rp-chart .col{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;position:relative}
.rp-chart .col i{width:100%;max-width:26px;height:0;border-radius:6px 6px 3px 3px;background:linear-gradient(180deg,#6a5cff,#4c8dff);transition:height .9s var(--spring)}
.rp-chart .col:nth-child(2) i{transition-delay:.08s}.rp-chart .col:nth-child(3) i{transition-delay:.16s}.rp-chart .col:nth-child(4) i{transition-delay:.24s}.rp-chart .col:nth-child(5) i{transition-delay:.32s}.rp-chart .col:nth-child(6) i{transition-delay:.4s}.rp-chart .col:nth-child(7) i{transition-delay:.48s}
.ad-rp.grow .rp-chart .col i{height:calc(var(--h) - 12px)}
.rp-chart .col span{position:absolute;bottom:-17px;font-size:10.5px;color:#7d7893}
.rp-chart svg{position:absolute;left:10px;right:10px;top:10px;width:calc(100% - 20px);height:60%;overflow:visible;pointer-events:none}
.rp-chart svg{clip-path:inset(0 100% 0 0);transition:clip-path 1.6s var(--ease) .5s}
.ad-rp.grow .rp-chart svg{clip-path:inset(0 0 0 0)}
.rp-chart .ln{fill:none;stroke:#e1306c;stroke-width:2.5;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
.rp-ch{display:flex;flex-direction:column;gap:7px;background:#fff;border:1px solid rgba(27,21,48,.08);border-radius:14px;padding:10px 12px}
.rp-ch small{color:#7d7893;font-size:11.5px}
.rp-ch .row{display:grid;grid-template-columns:78px 1fr 34px;gap:8px;align-items:center;font-size:12.5px}
.rp-ch .tr{height:8px;border-radius:4px;background:#f0eef8;overflow:hidden}
.rp-ch .tr i{display:block;height:100%;width:0;border-radius:4px;background:var(--c);transition:width 1s var(--spring)}
.ad-rp.ch .rp-ch .tr i{width:var(--w)}
.rp-ch b{text-align:right}
@media (max-width:560px){.rp-k b{font-size:18px}.g-h{font-size:16.5px}.rp-chart{height:110px}}