/* ---------- Fonts (merged from fonts.css). One woff2 per family; font-display:swap
   loads them off the critical path — text paints immediately in the fallback and
   swaps when the brand font arrives. JetBrains Mono is the four Latin+Cyrillic
   Google subsets merged into a single file. Google-subset fallbacks (Unbounded,
   Archivo) and the ttf/otf duplicates were dropped as unused. ---------- */
@font-face{font-family:'Kharkiv Tone';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/KharkivTone.woff2) format('woff2');}
@font-face{font-family:'Random Grotesque Standard Bold';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/RandomGrotesque-Bold.woff2) format('woff2');}
@font-face{font-family:'TT Norms Pro Mono';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/TTNormsProMono.woff2) format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/JetBrainsMono.woff2) format('woff2');}

:root{
  --black:#000; --ink:#0a0a0a; --white:#fff; --cream:#f4f4f2;
  --green:#7eff00; --green2:#7dff01;
  /* --g76 darkened from #767676 → 4.5:1 on cream/white (WCAG AA); --g88 stays for text on dark bg */
  --g88:#888; --g76:#6b6b6b; --g4b:#4b4b4b; --gc9:#c9c9c9;
  --line-d:rgba(0,0,0,.1); --line-l:rgba(255,255,255,.15);
  /* system fallback after each brand font — the old webfont fallbacks were never rendered */
  --display:"Kharkiv Tone",sans-serif;
  --mono:"TT Norms Pro Mono","JetBrains Mono",ui-monospace,monospace;
  --grotesk:"Random Grotesque Standard Bold",sans-serif;
  --quote:"JetBrains Mono",ui-monospace,monospace;
}
*{box-sizing:border-box;}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--mono);}
a{color:inherit;text-decoration:none;}
a:hover{color:var(--green2);}
img{display:block;}

.display{font-family:var(--display);font-weight:400;text-transform:uppercase;}
.inner{max-width:1152px;margin:0 auto;width:100%;}

.eyebrow{font-family:var(--mono);font-size:16px;letter-spacing:-.01em;color:var(--g76);line-height:1.5;}
.h2{margin:0;font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:46px;line-height:50px;color:var(--ink);}

/* ---------- Header ---------- */
header{position:fixed;top:0;left:0;right:0;z-index:50;height:64px;
  background:rgba(0,0,0,.88);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  padding:0 144px;display:flex;align-items:center;}
.hrow{max-width:1152px;margin:0 auto;width:100%;display:flex;align-items:center;justify-content:space-between;}
.logo{display:inline-flex;align-items:center;}
.logo img{height:24px;width:auto;display:block;}
nav.main{display:flex;gap:24px;}
nav.main a{font-family:var(--mono);font-size:14px;color:var(--gc9);}
nav.main a:hover{color:var(--green2);}
.hactions{display:flex;align-items:center;gap:8px;}
.lang{display:inline-flex;gap:4px;font-size:14px;color:var(--g88);padding-right:6px;cursor:pointer;user-select:none;}
.lang b{font-weight:400;color:var(--g88);}
.lang b.on{color:#fff;}
.hbtn{height:44px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;
  padding:8px 16px;font-family:var(--grotesk);font-weight:700;font-size:12px;text-transform:uppercase;line-height:1;white-space:nowrap;}
.hbtn.ghost{box-shadow:inset 0 0 0 1px var(--line-l);color:#fff;transition:box-shadow .15s ease,color .15s ease;}
.hbtn.ghost:hover{color:var(--green2);box-shadow:inset 0 0 0 1px var(--green2);}
.hbtn.solid{background:var(--green);color:var(--ink);transition:background .15s ease,box-shadow .15s ease;}
.hbtn.solid:hover{background:#fff;box-shadow:inset 0 0 0 1px var(--ink);}
.burger{display:none;width:40px;height:40px;border:0;background:transparent;padding:0;cursor:pointer;align-items:center;justify-content:center;}
.burger svg{display:block;}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;height:56px;border-radius:8px;
  padding:16px 32px;font-family:var(--grotesk);font-weight:700;font-size:14px;letter-spacing:.02em;
  text-transform:uppercase;line-height:1;white-space:nowrap;cursor:pointer;
  transition:background .18s ease,color .18s ease,box-shadow .18s ease;}
.btn.dark{background:var(--ink);color:var(--green);box-shadow:inset 0 0 0 2px var(--ink);}
.btn.dark:hover{background:var(--green);color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink);}
.btn.green{background:var(--green);color:var(--ink);box-shadow:inset 0 0 0 2px var(--green);}
.btn.green:hover{background:var(--ink);color:var(--green);box-shadow:inset 0 0 0 2px var(--green2);}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:880px;overflow:hidden;display:flex;flex-direction:column;
  justify-content:center;align-items:center;padding:64px 24px;}
/* The plain url() line is the fallback: engines without image-set() drop the next declaration. */
.hero .bg{position:absolute;inset:0;background:url('assets/hero.jpg') center/cover no-repeat;opacity:.75;}
.hero .bg{background-image:image-set(url('assets/hero.webp') type('image/webp'),url('assets/hero.jpg') type('image/jpeg'));}
.hero .glow{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);width:1000px;height:460px;
  background:radial-gradient(closest-side, rgba(255,255,255,.75), rgba(255,255,255,0));
  filter:blur(4px);pointer-events:none;}
.hero .content{position:relative;max-width:900px;display:flex;flex-direction:column;align-items:center;gap:44px;}
.hero h1{margin:0;font-family:var(--display);text-transform:uppercase;font-weight:400;font-size:76px;
  line-height:82px;text-align:center;color:#000;white-space:pre-line;}
.hero .sub{max-width:560px;text-align:center;font-size:16px;line-height:1.5;letter-spacing:-.01em;color:#000;white-space:pre-line;}
.hero .stack{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%;}
.hero .note{font-size:14px;color:var(--g4b);text-align:center;}
.hero .headgroup{display:flex;flex-direction:column;align-items:center;gap:16px;}

/* ---------- Marquee ---------- */
.marquee{background:var(--black);border-top:2px solid var(--green2);border-bottom:2px solid var(--green2);
  border-left:1px solid var(--green2);border-right:1px solid var(--green2);height:60px;overflow:hidden;display:flex;align-items:center;}
.track{display:flex;align-items:center;gap:48px;padding-right:48px;white-space:nowrap;animation:scroll 40s linear infinite;flex-shrink:0;}
.marquee:hover .track{animation-play-state:paused;}
.track span.m{font-size:16px;letter-spacing:-.01em;line-height:1.5;text-transform:uppercase;}
.track .lbl{color:#fff;}
.track .pay{color:#fff;}
.suiti{width:16px;height:16px;display:inline-block;flex:0 0 auto;}
.track .suiti{color:var(--g88);}
@keyframes scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ---------- Stats ---------- */
.stats{background:var(--black);padding:72px 144px;}
.stats .row{display:flex;justify-content:center;align-items:center;gap:36px;padding:0 24px;}
.stat{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;}
.stat .num{font-family:var(--display);text-transform:uppercase;font-size:60px;line-height:102px;color:var(--green2);}
.stat .lbl{font-size:14px;color:var(--g88);text-align:center;}

/* ---------- Section shells ---------- */
section.blk{padding:120px 144px;}
section.cream{background:var(--cream);}
section.wht{background:var(--white);}
section.dark{background:var(--black);}
.sec-head{display:flex;flex-direction:column;gap:16px;}
.lede{font-size:16px;line-height:1.5;letter-spacing:-.01em;}

/* ---------- Feature cards ---------- */
.card{border-radius:8px;box-shadow:inset 0 0 0 1px var(--line-d);padding:24px;display:flex;flex-direction:column;gap:16px;}
.card .top{display:flex;align-items:center;gap:16px;}
.card .top .ico{width:24px;height:24px;flex:0 0 auto;}
.card h3{margin:0;font-family:var(--grotesk);font-weight:700;text-transform:uppercase;font-size:20px;line-height:1;color:#000;}
.card p{margin:0;font-size:16px;line-height:1.5;letter-spacing:-.01em;color:var(--g76);}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.cardw{background:#fff;}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.card.soft{background:#fff;}
.card.soft .top .suiti{width:20px;height:20px;color:#000;}
.card.soft p{color:var(--g76);}

/* ---------- Advertisers (02) ---------- */
.adv-body{display:flex;gap:24px;}
.adv-left{width:662px;display:flex;flex-direction:column;justify-content:space-between;gap:24px;}
.adv-left .p{font-size:16px;line-height:1.5;letter-spacing:-.01em;color:#000;white-space:pre-line;}
.adv-list{flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:20px;}
.li{display:flex;gap:14px;align-items:flex-start;}
.li:first-child{padding-top:0;}
.li .d{font-family:Menlo,var(--quote);font-size:14px;line-height:23.8px;color:#000;}
.li .dsuit{width:12px;height:12px;color:#000;flex:0 0 auto;margin-top:5px;}
.li .t{flex:1;font-size:16px;line-height:1.5;letter-spacing:-.01em;color:#000;}
.adv-note{font-size:14px;line-height:1.5;color:var(--g76);white-space:pre-line;}

/* ---------- Pricing (03) ---------- */
.price-cards{display:flex;gap:24px;justify-content:center;}
.pcard{flex:1;border-radius:8px;box-shadow:inset 0 0 0 1px var(--line-l);padding:24px;display:flex;flex-direction:column;gap:16px;position:relative;}
.badge{align-self:flex-start;background:var(--green2);border-radius:8px;padding:5.25px 14px 6.15px;
  font-size:16px;letter-spacing:-.01em;color:#000;line-height:1.5;}
.badge.rev{background:#000;color:#fff;}
.badge.hyb{background:var(--g76);color:#fff;}
.pcard .grp{display:flex;flex-direction:column;gap:8px;}
.pcard h3{margin:0;font-family:var(--grotesk);font-weight:700;text-transform:uppercase;font-size:20px;line-height:1;color:#fff;}
.pcard .val{font-family:var(--display);text-transform:uppercase;font-size:18px;line-height:1;letter-spacing:.02em;color:#fff;padding:2.69px 0;}
.pcard .desc{font-size:16px;line-height:1.5;letter-spacing:-.01em;color:var(--g76);}
.price-note{max-width:560px;font-size:14px;line-height:1.5;color:#fff;}

/* ---------- Section 02 Рекламодавцям — dark, green body text ---------- */
#advertisers .eyebrow{color:var(--g88);}
#advertisers .h2{color:#fff;}
#advertisers .adv-left .p{color:var(--green2);}
#advertisers .li .t{color:#fff;}
#advertisers .li .dsuit{color:var(--green2);}
#advertisers .adv-note{color:var(--g88);}

/* ---------- Section 03 Моделі оплати — light, light cards ---------- */
#models{background:#fff;}
#models .eyebrow{color:var(--g76);}
#models .h2{color:var(--ink);}
#models .pcard{box-shadow:inset 0 0 0 1px var(--line-d);}
#models .pcard h3{color:#000;}
#models .pcard .val{color:#000;}
#models .price-note{color:#000;}

/* ---------- Testimonials (04) ---------- */
.tst-row{display:flex;gap:24px;justify-content:center;align-items:center;}
.arrow{width:32px;height:32px;flex:0 0 auto;border:0;border-radius:50%;
  background:#000;display:flex;align-items:center;justify-content:center;color:var(--green2);cursor:pointer;transition:background .15s ease,color .15s ease,box-shadow .15s ease;}
.arrow:hover{background:var(--green2);color:#000;box-shadow:none;}
.arrow svg{width:14px;height:14px;display:block;}
.tst-viewport{flex:1;overflow-x:auto;scroll-snap-type:x mandatory;-ms-overflow-style:none;scrollbar-width:none;}
.tst-viewport::-webkit-scrollbar{display:none;}
.tst-track{display:flex;gap:24px;align-items:flex-start;}
.tst{flex:0 0 calc((100% - 24px)/2);background:#fff;border-radius:8px;box-shadow:inset 0 0 0 1px var(--line-d);padding:24px;
  scroll-snap-align:start;display:flex;flex-direction:column;gap:16px;}
.tst .q{font-family:var(--quote);font-size:14.5px;line-height:24.65px;color:#000;}
.tst .who{display:flex;align-items:center;gap:10px;}
.tst .av{width:40px;height:40px;border-radius:50%;background:#000;display:flex;align-items:center;justify-content:center;
  font-family:var(--quote);font-size:12px;color:var(--green2);}
.tst .meta{font-size:14px;color:var(--g76);}
.dots{display:flex;gap:8px;justify-content:center;align-items:center;}
.dot{width:8px;height:8px;border-radius:4px;background:rgba(0,0,0,.2);transition:width .35s cubic-bezier(.4,0,.2,1),background .35s ease;}
.dot.on{width:24px;background:#000;}

/* ---------- Team (05) ---------- */
.team-lede{color:var(--g88);white-space:pre-line;}
.team-row{display:flex;gap:14px;justify-content:center;}
.tcard{flex:1;border-radius:16px;box-shadow:inset 0 0 0 1px var(--line-l);padding:24px;
  display:flex;flex-direction:column;align-items:center;gap:16px;}
.tcard .circle{width:84px;height:84px;border-radius:50%;background:var(--cream);display:flex;align-items:center;justify-content:center;}
.tcard .circle .suit{font-size:30px;color:#000;line-height:1;}
.tcard .circle .suiti{width:34px;height:34px;color:#000;}
.tcard .name{font-family:var(--display);text-transform:uppercase;font-size:18px;letter-spacing:.02em;color:#fff;padding:12px 0;}
.tcard .role{font-size:14px;line-height:1.5;color:var(--g88);text-align:center;min-height:42px;}
.tcard .tgroup{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;}

/* ---------- FAQ (06) ---------- */
.faq{display:flex;flex-direction:column;}
.faq .row{border-bottom:1px solid var(--line-d);}
.faq .qline{display:flex;align-items:center;gap:16px;padding:24px 40px 24px 0;cursor:pointer;}
.faq .q{flex:1;font-family:var(--display);text-transform:uppercase;font-size:18px;line-height:1.1;letter-spacing:.02em;color:var(--ink);}
.faq .plus{width:32px;height:32px;flex:0 0 auto;border:0;padding:0;border-radius:50%;background:#000;
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .25s ease,background .2s ease;}
.faq .plus svg{display:block;fill:var(--green2);transition:fill .2s ease;}
.faq .plus:hover{background:var(--green2);}
.faq .plus:hover svg{fill:#000;}
.faq .arow{overflow:hidden;}
.faq .a{font-size:16px;line-height:1.5;letter-spacing:-.01em;color:var(--g76);max-width:823px;padding:0 40px 24px 0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.faq .row.open .a{white-space:normal;overflow:visible;}
.faq .row.open .plus{transform:rotate(45deg);}

/* ---------- Final CTA ---------- */
.cta{position:relative;overflow:hidden;background:var(--green2);min-height:500px;padding:96px 144px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;}
.cta .bg{position:absolute;inset:0;background:url('assets/hero.jpg') center/cover no-repeat;mix-blend-mode:luminosity;opacity:.9;}
.cta .bg{background-image:image-set(url('assets/hero.webp') type('image/webp'),url('assets/hero.jpg') type('image/jpeg'));}
.cta .glow{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:1100px;height:460px;
  background:radial-gradient(closest-side, rgba(241,241,241,.45), rgba(255,255,255,0));filter:blur(3px);}
.cta .content{position:relative;display:flex;flex-direction:column;align-items:center;gap:44px;}
.cta .headgroup{display:flex;flex-direction:column;align-items:center;gap:16px;}
.cta h2{margin:0;font-family:var(--display);text-transform:uppercase;font-weight:400;font-size:76px;line-height:82px;
  text-align:center;color:#000;white-space:pre-line;}
.cta .sub{font-family:var(--display);text-transform:uppercase;font-size:18px;letter-spacing:.02em;color:#000;text-align:center;}

/* ---------- Footer ---------- */
footer{background:var(--black);padding:40px 0;}
.fcol-wrap{display:flex;flex-direction:column;gap:48px;}
.ftop{display:flex;gap:24px;padding:0 144px;justify-content:space-between;}
.fbrand{width:367px;display:flex;flex-direction:column;gap:16px;}
.chips{display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start;}
.chip{height:32px;border-radius:6px;box-shadow:inset 0 0 0 1px var(--line-l);padding:4px 12px;
  display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--g88);}
.fnav{display:flex;gap:24px;flex:1;}
.fgroup{flex:1;display:flex;flex-direction:column;gap:16px;}
.fgroup h3{margin:0;font-size:16px;font-weight:400;letter-spacing:-.01em;color:#fff;line-height:1.5;}
.flist{display:flex;flex-direction:column;}
.flist a{font-family:var(--quote);font-size:13px;line-height:22.1px;color:var(--g88);padding:5px 0;}
.flist a:hover{color:#fff;}
.fbar{border-top:1px solid var(--line-l);padding:24px 144px;display:flex;justify-content:space-between;}
.fbar span{font-size:14px;color:var(--g88);}

/* ---------- Mobile menu overlay ---------- */
.mobile-menu{position:fixed;inset:0;z-index:100;background:var(--black);display:none;flex-direction:column;}
.mobile-menu.open{display:flex;}
.mm-head{height:64px;flex:0 0 auto;background:var(--black);padding:0 16px;display:flex;align-items:center;justify-content:space-between;}
.mm-right{display:flex;align-items:center;gap:16px;}
.mm-head .lang{font-size:16px;padding-right:0;}
.mm-close{width:40px;height:40px;border:0;background:transparent;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.mm-close svg{display:block;}
.mm-nav{flex:1;display:flex;flex-direction:column;gap:16px;padding:24px 16px;overflow:auto;}
.mm-nav a{font-family:var(--display);text-transform:uppercase;font-weight:400;font-size:18px;line-height:1;letter-spacing:.02em;color:var(--g88);height:40px;display:flex;align-items:center;}
.mm-nav a:hover{color:var(--ink);}
.mm-foot{padding:24px 16px 32px;display:flex;flex-direction:column;gap:8px;}
.mm-foot .btn{width:100%;}
.mm-foot .hbtn{width:100%;height:56px;font-size:14px;}

/* ---------- 404 ---------- */
.err{position:relative;min-height:100vh;overflow:hidden;display:flex;flex-direction:column;
  justify-content:center;align-items:center;padding:64px 24px;}
.err .bg{position:absolute;inset:0;background:url('assets/hero.jpg') center/cover no-repeat;opacity:.75;}
.err .bg{background-image:image-set(url('assets/hero.webp') type('image/webp'),url('assets/hero.jpg') type('image/jpeg'));}
.err .glow{position:absolute;left:50%;top:56%;transform:translate(-50%,-50%);width:1000px;height:460px;
  background:radial-gradient(closest-side, rgba(255,255,255,.72), rgba(255,255,255,0));filter:blur(4px);pointer-events:none;}
.err .content{position:relative;display:flex;flex-direction:column;align-items:center;gap:44px;}
.err .top{display:flex;flex-direction:column;align-items:center;gap:24px;}
.err h1{margin:0;font-family:var(--display);text-transform:uppercase;font-weight:400;font-size:76px;line-height:82px;text-align:center;color:#000;}
.err .subs{display:flex;flex-direction:column;align-items:center;gap:8px;}
.err .s1{font-family:var(--grotesk);font-weight:700;text-transform:uppercase;font-size:20px;line-height:1;color:#000;text-align:center;}
.err .s2{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;
  font-family:var(--grotesk);font-weight:700;text-transform:uppercase;font-size:20px;line-height:1.3;color:#000;text-align:center;}
.err .s2 .b{background:var(--green2);border-radius:6px;padding:2px 10px;color:#000;}

/* ---------- Legal page (Terms of Use) ---------- */
.legal{padding-top:184px;}
.legal .inner{display:flex;flex-direction:column;gap:44px;}
.legal h1{margin:0;font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:46px;line-height:50px;color:var(--ink);}
.legal .updated{font-size:14px;color:var(--g76);}
.legal .callout{border-radius:8px;box-shadow:inset 0 0 0 1px var(--line-d);background:#fff;padding:24px;
  display:flex;flex-direction:column;gap:16px;}
.legal .callout p{margin:0;font-size:16px;line-height:1.5;letter-spacing:-.01em;color:#000;}
.legal .callout p.strong{font-family:var(--grotesk);font-weight:700;text-transform:uppercase;font-size:14px;line-height:1.4;letter-spacing:.02em;}
.lsec{display:flex;flex-direction:column;gap:24px;}
.lsec h2{margin:0;font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:24px;line-height:1.25;letter-spacing:.02em;color:var(--ink);
  padding-bottom:16px;border-bottom:1px solid var(--line-d);}
.lsec .body{display:flex;flex-direction:column;gap:20px;}

/* numbered clause: hanging number in the left gutter */
.cl{display:grid;grid-template-columns:56px 1fr;gap:16px;align-items:baseline;}
.cl .n{font-family:var(--quote);font-size:14px;line-height:1.5;color:var(--g76);}
.cl .txt{display:flex;flex-direction:column;gap:12px;min-width:0;}
.cl p{margin:0;font-size:16px;line-height:1.6;letter-spacing:-.01em;color:var(--g4b);}
.cl p.caps{font-size:14px;line-height:1.6;color:var(--g76);}
.cl ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:10px;}
.cl li{font-size:16px;line-height:1.6;letter-spacing:-.01em;color:var(--g4b);}
.cl li::marker{color:var(--green2);}

/* definitions */
.defs{display:flex;flex-direction:column;gap:20px;}
.def{display:flex;flex-direction:column;gap:6px;}
.def .dt{font-family:var(--grotesk);font-weight:700;text-transform:uppercase;font-size:15px;line-height:1.3;letter-spacing:.02em;color:#000;}
.def .dd{font-size:16px;line-height:1.6;letter-spacing:-.01em;color:var(--g4b);}

/* ============ TABLET/DESKTOP PADDING ============ */
@media(max-width:1320px){
  header,section.blk,.stats,.cta{padding-left:48px;padding-right:48px;}
  .ftop,.fbar{padding-left:48px;padding-right:48px;}
}

/* ============ MOBILE ============ */
@media(max-width:1024px){
  /* header */
  header{padding:0 16px;background:var(--black);}
  nav.main,.hactions{display:none;}
  .burger{display:flex;}

  /* type + spacing */
  .h2{font-size:28px;line-height:40px;}
  section.blk{padding:40px 16px;}
  .inner[style]{gap:32px !important;}

  /* hero — full viewport, left aligned */
  .hero{min-height:100vh;padding:104px 16px 56px;justify-content:center;align-items:flex-start;}
  .hero .content{gap:44px;width:100%;align-items:flex-start;}
  .hero .headgroup{align-items:flex-start;}
  .hero h1{font-size:36px;line-height:43px;text-align:left;}
  .hero .sub{text-align:left;}
  .hero .stack{align-items:flex-start;}
  .hero .note{text-align:left;}
  .hero .stack .btn{width:100%;}

  /* stats 2x2 */
  .stats{padding:40px 16px;}
  .stats .row{flex-wrap:wrap;gap:16px;padding:0;}
  .stat{flex:1 1 40%;min-width:40%;gap:0;}
  .stat .num{font-size:36px;line-height:102px;}
  .stat:nth-child(1){order:1}
  .stat:nth-child(4){order:2}
  .stat:nth-child(3){order:3}
  .stat:nth-child(2){order:4}

  /* stack everything */
  .grid3,.grid2{grid-template-columns:1fr;gap:16px;}
  .price-cards,.team-row{flex-direction:column;gap:16px;}
  .adv-body{flex-direction:column;gap:24px;}
  .adv-left{width:auto;display:contents;}
  .adv-left .p{order:1;}
  .adv-body .adv-list{order:2;}
  .adv-cta{order:3;width:100%;}
  .adv-left .btn,.perevagy-btn{width:100%;}

  /* section 02 Рекламодавцям — dark theme handled globally; mobile keeps reorder only */
  .btn.section-full{width:100%;}

  /* team card: avatar + text on top row, full-width button below */
  .tcard{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:16px;text-align:left;}
  .tcard .circle{width:64px;height:64px;grid-column:1;grid-row:1;}
  .tcard .circle .suiti{width:26px;height:26px;}
  .tcard .tgroup{grid-column:2;grid-row:1;align-items:flex-start;text-align:left;gap:4px;width:auto;}
  .tcard .name{padding:0;}
  .tcard .role{text-align:left;min-height:0;}
  .tcard .btn{grid-column:1 / -1;grid-row:2;width:100%;}

  /* mobile card padding */
  .card,.pcard,.tst,.tcard{padding:24px;}

  /* pricing label to top-right corner */
  .pcard{padding-top:24px;}
  .pcard .badge{position:absolute;top:24px;right:24px;align-self:auto;}
  .pcard .grp{padding-right:92px;}

  /* testimonials: 1 per view, hide arrows (swipe) */
  .arrow{display:none;}
  .tst{flex:0 0 100%;}

  /* faq */
  .faq .qline{padding:24px 0;}
  .faq .q{font-size:18px;}
  .faq .a{padding-right:0;}
  /* mobile: no answer preview when collapsed */
  .faq .row:not(.open) .arow{display:none;}

  /* cta */
  .cta{padding:56px 16px;min-height:auto;}
  .cta h2{font-size:36px;line-height:43px;}
  .cta .content .btn{width:100%;}

  /* footer — Навігація left, Правове + Зв'язок stacked to its right */
  .ftop{flex-direction:column;gap:32px;padding:0 16px;}
  .fbrand{width:auto;align-items:center;text-align:center;}
  .chips{justify-content:center;}
  .fnav{display:grid;grid-template-columns:1fr 1fr;gap:32px 16px;}
  .fnav .fgroup:nth-child(1){grid-column:1;grid-row:1 / span 2;}
  .fnav .fgroup:nth-child(2){grid-column:2;grid-row:1;}
  .fnav .fgroup:nth-child(3){grid-column:2;grid-row:2;}
  .fbar{flex-direction:column;gap:12px;padding:24px 16px;align-items:center;text-align:center;}

  /* legal */
  .legal{padding-top:104px;}
  .legal h1{font-size:28px;line-height:36px;}
  .lsec h2{font-size:20px;}
  .cl{grid-template-columns:44px 1fr;gap:12px;}
  .legal .callout{padding:20px;}

  /* hero: serve a phone-sized background — the 2400px source is wasted on small screens.
     plain url() first as the fallback, image-set override for engines that support it. */
  .hero .bg,.cta .bg,.err .bg{background-image:url('assets/hero-mobile.jpg');}
  .hero .bg,.cta .bg,.err .bg{background-image:image-set(url('assets/hero-mobile.webp') type('image/webp'),url('assets/hero-mobile.jpg') type('image/jpeg'));}

  /* 404 */
  .err{padding:96px 16px 40px;}
  .err h1{font-size:64px;line-height:70px;}
  .err .s2{white-space:normal;}
  .err .s2 .b{background:var(--green2);border-radius:6px;padding:2px 8px;}
  .err .content .btn{width:100%;}
}
