/* ==========================================================================
   ClickOn Affiliates — built pixel-for-pixel from Figma
   Scale model: 1rem = 10px at the 1920px desktop frame (scales with viewport,
   capped at 1920). Phone frame (390px) uses 1rem = 10px at 390 (max-width 820).
   All values below are Figma px / 10.
   ========================================================================== */

:root{
  --blue:#2563EB; --lblue:#60A5FA; --pale:#DBEAFE; --dark:#162033; --navy:#0A192F;
  --gray:#696969; --bg:#F8FAFC; --ice:#E9F2FE; --slate:#CBD5E1; --steel:#6487B9;
  --ink:#0F172A; --green:#22C55E;
}
html{font-size:calc(100vw / 192);-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (min-width:1920px){html{font-size:10px}}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:'Assistant',Arial,Helvetica,sans-serif;color:var(--dark);background:#fff;direction:rtl;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:none}
a{color:inherit;text-decoration:none}
h1,h2,h3,p{margin:0}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
.wrap{width:192rem;margin:0 auto;position:relative}
.phone{display:none}
.pc{display:initial}
br.pc{display:inline}
.sec-title{font-size:6.1rem;line-height:7.98rem;font-weight:700;text-align:center;position:absolute;left:0;right:0;white-space:nowrap}
.c-blue{color:var(--blue)}.c-lblue{color:var(--lblue)}.c-dark{color:var(--dark)}.c-pale{color:var(--ice)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:99rem;font-weight:600;color:#fff;white-space:nowrap;line-height:1}
.btn-fill{background:var(--blue)}
.btn-outline{border:.2rem solid #fff}
.btn-sm{width:24.7rem;height:2.7rem;font-size:1.6rem}
.btn-sm.btn-outline{border-width:.157rem}
.btn-lg{width:48.2rem;height:5rem;font-size:2rem}
.btn-lg.btn-outline{font-weight:400}
.btn-lg.btn-outline b{font-weight:600}

/* Arrows */
.arrows{position:absolute;left:0;right:0;display:flex;justify-content:center;gap:2.8rem;direction:ltr}
.arrow{width:6rem;height:6rem}
.arrow img{width:6rem;height:6rem}
.arrow-prev{order:2}                 /* points right, sits on the right */
.arrow-next{order:1}                 /* points left, sits on the left  */
.arrow-next img{transform:rotate(180deg)}
.arrow:disabled{opacity:.35;cursor:default}

/* Dots */
/* Marquee wrappers (built by main.js): two copies side by side, glide to -50% */
.marquee{display:flex;width:max-content;direction:ltr;will-change:transform}
.marquee > *{position:relative!important;left:auto!important;right:auto!important;top:auto!important;flex:none;transition:none!important}

.dots{display:flex;gap:.9rem}
.dots i,.dots button{width:.9rem;height:.9rem;border-radius:50%;background:var(--ice);display:block}
.dots .on{background:var(--lblue)}

/* ==========================================================================
   HEADER
   ========================================================================== */
.site-header{position:absolute;top:0;left:0;right:0;z-index:20}
.site-header .wrap{height:20.5rem}
.logo{position:absolute;left:74.2rem;top:4.2rem}
.logo img{width:37.4rem;height:9.1rem;object-fit:cover}
.main-nav{position:absolute;left:60.8rem;top:17.7rem;width:126.4rem;height:2.9rem;display:flex;justify-content:space-between;align-items:center;font-size:2.2rem;line-height:2.88rem;font-weight:600;letter-spacing:.5rem;color:#fff;white-space:nowrap}
.main-nav a{position:relative}
.main-nav a.active::before{content:"";position:absolute;right:0;top:-2.1rem;width:5.5rem;height:.3rem;background:var(--green)}
.main-nav .sep{opacity:1}
.header-btns{position:absolute;left:3.3rem;top:17.8rem;display:flex;gap:2.5rem}
.burger{display:none}
.mobile-menu{display:none}

/* ==========================================================================
   HERO
   ========================================================================== */
.hero{position:relative;height:86.9rem;overflow:hidden;background:var(--navy)}
.hero .wrap{height:100%}
.hero-bg{position:absolute;left:0;right:0;top:0;height:100%}
.hero-bg-video,.hero-bg-photo{position:absolute;overflow:hidden}
.hero-bg-video{--w:max(232.4rem,100vw + 30rem);left:calc(50% - 6.8rem - var(--w) / 2);top:-29.3rem;width:var(--w);height:116.1rem}
.hero-bg-photo{left:calc(50% - 108.8rem);top:-15.1rem;width:140.8rem;height:102rem}
.hero-bg-video img{width:100%;height:100%;object-fit:cover}
.hero-bg-photo img{width:100%;height:100%;object-fit:cover}
.hero-bg-video::after,.hero-bg-photo::after{content:"";position:absolute;inset:0}
.hero-bg-video::after{background:rgba(10,25,47,.78)}
.hero-bg-photo::after{background:rgba(10,25,47,.5)}
.hero-fade{position:absolute;left:0;right:0;top:63.3rem;height:23.6rem;background:linear-gradient(180deg,rgba(255,255,255,0) 58%,#fff 100%)}
.hero-title{position:absolute;right:6.5rem;top:25.6rem;width:101.8rem;font-size:9.885rem;line-height:10rem;font-weight:600;color:#fff;text-align:right}
.hero-title .grad{font-size:10.2rem;font-weight:800;background:radial-gradient(50% 50% at 50% 50%,#00FF5E 0%,#009436 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-sub{position:absolute;right:7.6rem;top:46.6rem;width:112.9rem;font-size:2.9rem;line-height:3.79rem;font-weight:400;color:#fff;text-align:right}
.hero-btns{position:absolute;right:8.4rem;top:61.2rem;display:flex;gap:2.3rem}

/* ==========================================================================
   CLIENTS
   ========================================================================== */
.clients{position:relative;height:69rem;overflow:hidden}
.clients .sec-title{top:5rem}
.clients-carousel{position:absolute;left:-4rem;top:24.2rem;width:204.2rem;height:38rem}
.clients-track{position:relative;height:31rem;overflow:hidden;direction:ltr}
.clients-set{position:absolute;left:0;top:0;width:204.2rem;height:31rem;margin-right:4rem}
.clients-set img{position:absolute;object-fit:contain}
.clients .arrows{top:32rem}

/* ==========================================================================
   HOW
   ========================================================================== */
.how{position:relative;height:163rem;background:var(--bg)}
.how .sec-title{top:5.2rem}
.how-sub{position:absolute;left:41.4rem;top:13.2rem;width:109.3rem;font-size:3.1rem;line-height:4.05rem;font-weight:300;text-align:center;color:var(--dark)}
.step{position:absolute;background:#fff;border:.09rem solid var(--lblue);border-radius:1.81rem;box-shadow:0 .4rem 1.27rem rgba(0,0,0,.25)}
.step-1{left:97.9rem;top:26.8rem;width:79rem;height:52.2rem}
.step-2{left:14.4rem;top:61.1rem;width:79rem;height:52.2rem}
.step-3{left:98.1rem;top:84rem;width:79.2rem;height:62.1rem}
.step .num{position:absolute;right:2.5rem;top:3rem;width:7.2rem;height:7.2rem;background:var(--pale);border-radius:.3rem;display:flex;align-items:center;justify-content:center;font-size:6.06rem;font-weight:300;color:var(--blue);line-height:1;padding-top:.4rem}
.step h3{position:absolute;right:10.8rem;top:2.1rem;font-size:3.02rem;line-height:3.95rem;font-weight:700;color:var(--blue);white-space:nowrap}
.step p{position:absolute;right:10.8rem;top:6.1rem;width:65.8rem;font-size:2.745rem;line-height:3.59rem;color:var(--gray);text-align:right}
.step-2 p{right:10.9rem;width:61.4rem}
.step-3 p{right:11rem;width:60.3rem}
.step .shot{position:absolute;box-shadow:0 1.2rem 1.2rem rgba(0,0,0,.15)}
.step-1 .shot{left:11.2rem;top:16.9rem;width:58rem;height:26.6rem}
.step-2 .shot{left:19.9rem;top:17.9rem;width:41.2rem;height:28rem}
.step-3 .shot{left:28.7rem;top:22.3rem;width:21.8rem;height:31.2rem;box-shadow:none}
.step .dots{position:absolute;left:50%;transform:translateX(-50%);bottom:3.1rem}
.step-3 .dots{bottom:4.5rem}
.line{position:absolute;display:block}
.line-1{left:75.8rem;top:48.15rem;width:22.2rem;height:1.1rem;background:var(--pale)}
.line-2{left:75.25rem;top:48.2rem;width:1.1rem;height:12.9rem;background:#95C3FF}
.line-3{left:80.75rem;top:113.2rem;width:1.1rem;height:23.4rem;background:#3A8EFF}
.line-4{left:81.3rem;top:135.95rem;width:16.9rem;height:1.1rem;background:var(--blue)}

/* ==========================================================================
   MEDIA ASSETS
   ========================================================================== */
.assets{position:relative;height:120rem}
.assets .sec-title{top:5rem}
.assets-carousel{position:absolute;left:0;top:19.4rem;width:192rem;height:120rem}
.assets-frame{position:absolute;left:3.3rem;top:0;width:185.3rem;height:80.6rem;border:.2rem solid var(--lblue);border-radius:7.6rem;overflow:hidden}
.assets-frame .marquee{position:absolute;left:0;top:0;width:400%;height:100%}
.assets-track{display:flex;height:100%;width:50%;direction:rtl}
.asset{flex:0 0 25%;margin:0;position:relative}
.asset-logo{position:absolute;top:6.3rem;left:50%;transform:translateX(-50%);object-fit:contain}
.asset-shot{position:absolute;bottom:10.5rem;left:50%;transform:translateX(-50%);box-shadow:0 1.1rem 4.47rem -.6rem rgba(0,0,0,.25);object-fit:cover}
.assets .arrows{top:85.6rem}

/* ==========================================================================
   MEDIA PARTNERS
   ========================================================================== */
.partners{position:relative;height:71.2rem}
.partners .sec-title{top:5rem}
.partners-carousel{position:absolute;left:0;top:20.6rem;width:192rem;height:70rem}
.partners-window{position:absolute;left:0;top:0;width:192rem;height:33.9rem;overflow:hidden;direction:ltr}
.partners-window .marquee{margin-left:-76.4rem;height:33.9rem}
.partners-track{position:absolute;left:-76.4rem;top:0;width:495.7rem;height:33.9rem}
.partners-track img{position:absolute;object-fit:contain}
.partners-track img.fill{object-fit:contain}
.partners .arrows{top:35.6rem}

/* ==========================================================================
   VIDEO
   ========================================================================== */
.video{position:relative;height:72.7rem}
.video-box{position:absolute;left:50.7rem;top:5rem;width:94.9rem;height:53.4rem;border-radius:.87rem;overflow:hidden}
.video-box img,.video-box video,.video-box iframe{width:100%;height:100%;object-fit:cover;border:0}

/* ==========================================================================
   LEAD CATEGORIES
   ========================================================================== */
.leads{position:relative;height:77.5rem}
.leads-head{position:absolute;right:54.8rem;top:0;width:82.4rem;height:11rem}
.leads-icon{position:absolute;right:0;top:0;width:10.8rem;height:11rem}
.leads-head h2{position:absolute;right:12.4rem;top:2.3rem;font-size:3.9rem;line-height:5.1rem;font-weight:700;color:var(--ink);white-space:nowrap}
.leads-head p{position:absolute;right:11.9rem;top:6.5rem;font-size:3.1rem;line-height:4.05rem;color:var(--steel);white-space:nowrap}
.leads-grid{position:absolute;left:28.3rem;top:15.6rem;width:135.3rem;margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(4,32.4rem);column-gap:1.9rem;row-gap:2.3rem}
.leads-grid li{position:relative;height:11.5rem;background:#fff;border:.0575rem solid var(--blue);border-radius:1.15rem;display:flex;align-items:center;padding:0 6.9rem 0 .4rem;font-size:2.3rem;line-height:3.01rem;font-weight:700;color:var(--blue)}
.leads-grid li.two{line-height:2.3rem}
.leads-grid .ic{position:absolute;right:1.5rem;top:3.4rem;width:4.6rem;height:4.6rem;background:var(--pale);border-radius:.19rem;display:flex;align-items:center;justify-content:center}

/* ==========================================================================
   SECTORS
   ========================================================================== */
.sectors{position:relative;height:98.9rem;background:var(--pale)}
.sectors .sec-title{top:9.8rem}
.sectors-sub{position:absolute;left:35.5rem;top:17.8rem;width:121.1rem;font-size:3.9rem;line-height:5.1rem;color:var(--blue);text-align:center}
.sector-cards{position:absolute;left:11.5rem;top:35.5rem;width:162.7rem;display:flex;gap:1.7rem}
.sector{position:relative;width:53.1rem;height:49.3rem;background:#fff;border:.122rem solid var(--lblue);border-radius:2.44rem}
.sector img{position:absolute;top:5.4rem;left:50%;transform:translateX(-50%)}
.sector:nth-child(3) img{top:5.1rem}
.sector h3{position:absolute;left:0;right:0;top:16.2rem;text-align:center;font-size:3.1rem;line-height:4.05rem;font-weight:700;color:var(--blue)}
.sector p{position:absolute;right:7.3rem;top:22rem;width:39.7rem;font-size:2.5rem;line-height:3.27rem;color:var(--gray);text-align:right}
.sector:nth-child(3) p{top:20.5rem;right:7.2rem;width:39.9rem}

/* ==========================================================================
   REVIEWS
   ========================================================================== */
.reviews{position:relative;height:77.9rem}
.reviews .sec-title{top:9.8rem}
.reviews-carousel{position:absolute;left:0;top:27.6rem;width:192rem;height:41.3rem;overflow:hidden}
.reviews-carousel .marquee{position:absolute;left:calc(100% - 235.3rem);top:0}
.reviews-track{position:absolute;right:-47.1rem;top:0;width:max-content;display:flex;gap:2.1rem;direction:rtl;padding-left:2.1rem}
.review{position:relative;flex:0 0 54.8rem;width:54.8rem;height:35.5rem;background:#fff;border:.18rem solid var(--lblue);border-radius:1.44rem}
.review .stars{position:absolute;right:4rem;top:4.2rem;width:13.3rem;height:2.4rem}
.review p{position:absolute;right:3.9rem;top:8.5rem;width:48.4rem;font-size:2rem;line-height:2.62rem;color:var(--gray);text-align:right}
.review h3{position:absolute;right:3.9rem;top:26rem;font-size:3.1rem;line-height:4.05rem;font-weight:700;color:var(--blue)}
.review span{position:absolute;right:3.9rem;top:30.1rem;font-size:2.5rem;line-height:3.27rem;color:var(--blue)}
.dots-nav{position:absolute;left:50%;transform:translateX(-50%);top:40.4rem}
.dots-nav button{border:.226rem solid var(--blue);background:var(--ice)}
.dots-nav button.on{background:var(--lblue)}

/* ==========================================================================
   FAQ
   ========================================================================== */
.faq{position:relative;height:98.4rem}
.faq .sec-title{top:5rem}
.faq-list{position:absolute;left:28.4rem;top:17.9rem;width:135.3rem}
.faq-list details{position:relative;margin-bottom:4.9rem}
.faq-list summary{list-style:none;cursor:pointer;position:relative;height:6.7rem;font-size:2.5rem;line-height:3.5rem;font-weight:600;color:var(--dark);text-align:right;padding-left:6rem}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary img{position:absolute;left:1.5rem;top:1.4rem;width:3.5rem;height:2.2rem;transition:transform .25s}
.faq-list details:not([open]) summary img{transform:rotate(180deg)}
.faq-a{background:rgba(219,234,254,.6);border-radius:1.257rem;min-height:12.7rem;padding:1.6rem 3.2rem 1.6rem 45.5rem}
.faq-a p{font-size:2rem;line-height:2.62rem;color:var(--dark);text-align:right;text-transform:uppercase}

/* ==========================================================================
   CONTACT
   ========================================================================== */
.contact{position:relative;height:108.6rem;background:var(--dark);overflow:hidden}
.contact .wrap{height:100%;z-index:3}
.contact-bg{position:absolute;left:0;right:0;top:0;height:100%;overflow:hidden}
.contact-bg img{--w:max(232.4rem,100vw + 32rem);position:absolute;left:calc(50% + 4.3rem - var(--w) / 2);top:.5rem;width:var(--w);height:108.1rem;object-fit:cover}
.contact-bg::after{content:"";position:absolute;inset:0;background:rgba(10,25,47,.78)}
.contact-bg::before{content:"";position:absolute;left:0;right:0;top:0;height:77.2rem;background:linear-gradient(180deg,#162033 0%,rgba(22,32,51,0) 100%);z-index:2}
.contact .sec-title{top:4.6rem;line-height:8.17rem}
.contact-sub{position:absolute;left:28.2rem;top:13.4rem;width:135.5rem;font-size:3.9rem;line-height:5.04rem;color:var(--slate);text-align:center}
.lead-form{position:absolute;left:60.9rem;top:23.3rem;width:70rem}
.field{display:block;position:relative;height:6.5rem;margin-bottom:3.3rem;background:#fff;border-radius:1.245rem}
.field-ta{height:14.9rem;margin-bottom:0}
.field input,.field textarea{display:block;width:100%;height:100%;border:0;background:transparent;padding:0 4.1rem;font:inherit;font-size:2.5rem;font-weight:600;color:var(--dark);outline:none;resize:none;border-radius:inherit}
.field textarea{padding-top:1.4rem;line-height:3.27rem}
.field > span{position:absolute;right:4.1rem;top:1.8rem;font-size:2.5rem;line-height:3.27rem;font-weight:600;color:var(--dark);pointer-events:none;transition:opacity .15s}
.field-ta > span{top:1.4rem}
.field input:focus + span,.field input:not(:placeholder-shown) + span,.field textarea:focus + span,.field textarea:not(:placeholder-shown) + span{opacity:0}
.consent{display:flex;align-items:center;justify-content:center;margin-top:2.7rem;height:2.6rem;font-size:2rem;line-height:2.6rem;color:var(--pale);cursor:pointer;white-space:nowrap}
.consent input{position:absolute;opacity:0;width:0;height:0}
.consent i{width:2.3rem;height:2.3rem;border:.207rem solid var(--pale);border-radius:.62rem;margin-left:1rem;position:relative;flex:none}
.consent input:checked + i::after{content:"";position:absolute;left:.55rem;top:.15rem;width:.6rem;height:1.2rem;border:solid var(--pale);border-width:0 .25rem .25rem 0;transform:rotate(45deg)}
.lead-form .btn{display:flex;margin:3.3rem auto 0}
.form-msg{margin-top:2rem;text-align:center;font-size:2.2rem;color:#fff}

/* ==========================================================================
   FLOATING
   ========================================================================== */
.floating{position:fixed;right:11.7rem;bottom:15.7rem;display:flex;flex-direction:column;gap:2.9rem;z-index:30}
.floating a{width:9.8rem;height:9.8rem;border-radius:50%;display:flex;align-items:center;justify-content:center}
.float-wa img{width:9.8rem;height:9.9rem}
.float-phone{background:var(--blue);box-shadow:0 .93rem .93rem rgba(0,0,0,.25)}
.float-phone img{width:4.7rem;height:4.7rem}

/* ==========================================================================
   PHONE — Figma frame 390px wide, 1rem = 10px at 390
   ========================================================================== */
@media (max-width:820px){
  html{font-size:calc(100vw / 39)}
  .wrap{width:39rem}
  .pc,br.pc{display:none}
  .phone{display:initial}
  br.phone{display:inline}
  .sec-title{font-size:2rem;line-height:2.62rem}
  .btn-sm{width:9.8rem;height:2.1rem;font-size:1.098rem}
  .btn-sm.btn-outline{border-width:.122rem}
  .btn-lg{width:23.5rem;height:3.3rem;font-size:1.4rem}
  .btn-lg.btn-outline{border-width:.133rem}
  .arrows{gap:1.4rem}
  .arrow,.arrow img{width:2rem;height:2rem}
  .dots{gap:.4rem}
  .dots i,.dots button{width:.4rem;height:.4rem}

  /* header */
  .site-header .wrap{height:10.1rem}
  .logo{left:12.3rem;top:6.6rem}
  .logo img{width:14.5rem;height:3.5rem}
  .main-nav{display:none}
  .header-btns{left:1rem;top:1.3rem;gap:.9rem}
  .burger{display:block;position:absolute;left:35.8rem;top:1.2rem;width:2.4rem;height:2.4rem}
  .burger img{width:2.4rem;height:2.4rem}
  .mobile-menu{display:block;position:fixed;left:.5rem;top:.5rem;width:38rem;height:37.2rem;background:var(--blue);border-radius:2.2rem;z-index:50;overflow:hidden;padding:4.8rem 4.4rem 0 0}
  .mobile-menu[hidden]{display:none}
  .mobile-menu a{display:block;font-size:1.4rem;line-height:2.08rem;color:var(--bg);margin-bottom:1.12rem;position:relative;z-index:2}
  .mobile-menu-bg{position:absolute;left:.8rem;top:12.3rem;width:21.7rem;height:23.7rem;opacity:.1;object-fit:contain}
  .mobile-menu .burger-close{left:auto;right:1.6rem;top:1.2rem;z-index:3}
  body.menu-open{overflow:hidden}

  /* hero */
  .hero{height:42.4rem}
  .hero-bg-video{left:-27rem;top:-1.1rem;width:93rem;height:43.3rem}
  .hero-bg-photo{display:none}
  .hero-fade{top:34.7rem;height:7.7rem}
  .hero-title{right:1.2rem;top:11.7rem;width:36rem;font-size:3.6rem;line-height:3.5rem;text-align:center}
  .hero-title .grad{font-size:3.5rem}
  .hero-sub{right:2.4rem;top:20.3rem;width:32.7rem;font-size:1.4rem;line-height:1.83rem;text-align:center}
  .hero-btns{right:7.6rem;top:28.2rem;flex-direction:column;gap:1rem}
  .hero-btns .btn-outline{order:2}

  /* clients */
  .clients{height:26.9rem}
  .clients .sec-title{top:2.3rem;left:5rem;right:5rem;white-space:normal;color:var(--dark)}
  .clients-carousel{left:5.1rem;top:9.7rem;width:28.8rem;height:16.5rem}
  .clients-track{height:12.7rem;width:28.8rem}
  .clients-set{width:auto!important;height:12.7rem;margin-right:1.6rem;display:grid;grid-auto-flow:column;grid-template-rows:repeat(2,6rem);grid-auto-columns:6rem;column-gap:1.6rem;row-gap:.7rem}
  .clients-set img{position:static!important;left:auto!important;top:auto!important;width:6rem!important;height:6rem!important}
  .clients .arrows{top:13.8rem}
  .clients-set img:nth-child(9){order:1}.clients-set img:nth-child(16){order:2}.clients-set img:nth-child(8){order:3}.clients-set img:nth-child(15){order:4}.clients-set img:nth-child(7){order:5}.clients-set img:nth-child(14){order:6}.clients-set img:nth-child(6){order:7}.clients-set img:nth-child(13){order:8}.clients-set img:nth-child(1){order:9}.clients-set img:nth-child(2){order:10}.clients-set img:nth-child(3){order:11}.clients-set img:nth-child(4){order:12}.clients-set img:nth-child(5){order:13}.clients-set img:nth-child(10){order:14}.clients-set img:nth-child(11){order:15}.clients-set img:nth-child(12){order:16}.clients-set img:nth-child(17){order:17}.clients-set img:nth-child(18){order:18}.clients-set img:nth-child(19){order:19}.clients-set img:nth-child(20){order:20}

  /* how */
  .how{height:81rem}
  .how .sec-title{top:1.2rem;font-weight:600}
  .how-sub{left:2.7rem;top:4.1rem;width:34.8rem;font-size:1.4rem;line-height:1.83rem}
  .step{border-width:.04rem;border-radius:.795rem;box-shadow:none}
  .step-1{left:2.1rem;top:9rem;width:34.7rem;height:22.9rem}
  .step-2{left:2.1rem;top:34.8rem;width:34.7rem;height:22.9rem}
  .step-3{left:2.1rem;top:60.7rem;width:34.8rem;height:27.3rem}
  .step .num{right:1rem;top:1.3rem;width:3.2rem;height:3.2rem;border-radius:.13rem;font-size:2.66rem;padding-top:.2rem}
  .step h3{right:4.7rem;top:.9rem;font-size:1.3rem;line-height:1.7rem}
  .step p{right:4.7rem;top:2.7rem;width:28.9rem;font-size:1.2rem;line-height:1.57rem}
  .step-2 p{right:4.7rem;width:27rem}
  .step-3 p{right:4.7rem;top:2.6rem;width:26.5rem}
  .step .shot{box-shadow:0 .53rem .53rem rgba(0,0,0,.15)}
  .step-1 .shot{left:4.9rem;top:7.4rem;width:25.5rem;height:11.7rem}
  .step-2 .shot{left:8.8rem;top:7.9rem;width:18.1rem;height:12.3rem}
  .step-3 .shot{left:12.6rem;top:9.8rem;width:9.6rem;height:13.7rem;box-shadow:none}
  .step .dots{bottom:1.3rem}
  .step-3 .dots{bottom:2rem}
  .line{display:none}

  /* assets */
  .assets{height:54.5rem}
  .assets .sec-title{top:10.1rem}
  .assets-carousel{left:0;top:15.1rem;width:39rem;height:40rem}
  .assets-frame{left:0;top:0;width:39rem;height:26.4rem;border:0;border-radius:0}
  .assets-frame .marquee{width:800%}
  .asset{flex:0 0 25%}
  .asset-logo{top:0;width:8.3rem!important;height:2.5rem!important}
  .asset-shot{top:4rem;bottom:auto;width:28.2rem!important;height:auto!important;box-shadow:0 1.1rem 2.85rem -.6rem rgba(0,0,0,.25)}
  .assets .arrows{top:30.3rem}

  /* partners */
  .partners{height:20.2rem}
  .partners .sec-title{top:0}
  .partners-carousel{top:4.9rem;width:39rem;height:15rem}
  .partners-window{left:1.2rem;width:37.8rem;height:8rem}
  .partners-window .marquee{margin-left:-14.76rem;height:7.6rem}
  .partners-track{transform:scale(.2246);transform-origin:0 0;margin-right:-384.4rem;margin-bottom:-26.3rem}
  .partners .arrows{top:8.9rem}

  /* video */
  .video{height:27.2rem}
  .video-box{left:0;top:0;width:40.1rem;height:22.6rem;border-radius:.4rem}

  /* leads */
  .leads{height:56.1rem}
  .leads-head{right:1.6rem;top:0;width:34.2rem;height:6.2rem}
  .leads-icon{width:6.1rem;height:6.2rem}
  .leads-head h2{right:7rem;top:1.4rem;font-size:2rem;line-height:2.62rem}
  .leads-head p{right:6.7rem;top:3.8rem;font-size:1.4rem;line-height:1.83rem}
  .leads-grid{left:2.1rem;top:9.4rem;width:34.8rem;grid-template-columns:repeat(2,16.9rem);column-gap:1rem;row-gap:1.2rem}
  .leads-grid li{height:6rem;border-width:.03rem;border-radius:.6rem;padding:0 3.6rem 0 .2rem;font-size:1.2rem;line-height:1.57rem}
  .leads-grid li.two{line-height:1.2rem}
  .leads-grid .ic{right:.8rem;top:1.8rem;width:2.4rem;height:2.4rem;border-radius:.1rem}
  .leads-grid .ic img{width:2rem!important;height:2rem!important;object-fit:contain}
  .leads-grid li:nth-child(1){order:1}.leads-grid li:nth-child(2){order:2}
  .leads-grid li:nth-child(5){order:3}.leads-grid li:nth-child(6){order:4}
  .leads-grid li:nth-child(3){order:5}.leads-grid li:nth-child(4){order:6}
  .leads-grid li:nth-child(7){order:7}.leads-grid li:nth-child(8){order:8}
  .leads-grid li:nth-child(9){order:9}.leads-grid li:nth-child(10){order:10}
  .leads-grid li:nth-child(12){order:11}.leads-grid li:nth-child(11){order:12}

  /* sectors */
  .sectors{height:51.5rem}
  .sectors .sec-title{top:3.2rem}
  .sectors-sub{left:2.7rem;top:5.8rem;width:34.7rem;font-size:1.4rem;line-height:1.83rem}
  .sector-cards{left:2rem;top:11.1rem;width:35rem;flex-wrap:wrap;justify-content:center;gap:1.1rem .4rem}
  .sector{width:17.3rem;height:18.9rem;border-width:.04rem;border-radius:.795rem}
  .sector:nth-child(1){order:3}.sector:nth-child(2){order:1}.sector:nth-child(3){order:2}
  .sector img{top:1rem;width:auto!important;height:3.2rem!important}
  .sector:nth-child(3) img{top:.9rem;height:2.9rem!important}
  .sector h3{top:4.9rem;font-size:1.6rem;line-height:2.09rem}
  .sector p,.sector:nth-child(3) p{top:7.3rem;right:1.2rem;width:16.1rem;font-size:1.2rem;line-height:1.57rem}

  /* reviews */
  .reviews{height:40.2rem}
  .reviews .sec-title{top:4.7rem}
  .reviews-carousel{top:12rem;width:39rem;height:25rem}
  .reviews-carousel .marquee{left:calc(100% - 98.4rem)}
  .reviews-track{gap:1.7rem;padding-left:1.7rem}
  .review{flex:0 0 30.2rem;width:30.2rem;height:19.6rem;border-width:.1rem;border-radius:.795rem}
  .review .stars{right:2.1rem;top:10.6rem;width:7.4rem;height:1.3rem}
  .review p{right:2.1rem;top:4.7rem;width:26.7rem;font-size:1.2rem;line-height:1.57rem}
  .review h3{right:2.1rem;top:14.4rem;font-size:1.6rem;line-height:2.09rem}
  .review span{right:2.1rem;top:16.6rem;font-size:1.4rem;line-height:1.83rem}
  .dots-nav{top:24.2rem}
  .dots-nav button{border-width:.1rem}

  /* faq */
  .faq{height:47.2rem}
  .faq .sec-title{top:0}
  .faq-list{left:2.6rem;top:5.3rem;width:33.8rem}
  .faq-list details{margin-bottom:3.2rem}
  .faq-list summary{height:3.7rem;font-size:1.3rem;line-height:1.82rem;padding-left:3rem}
  .faq-list summary img{left:.5rem;top:.6rem;width:1.4rem;height:.9rem}
  .faq-a{border-radius:.4rem;min-height:6.2rem;padding:.5rem .8rem .5rem 3.1rem}
  .faq-a p{font-size:1.2rem;line-height:1.57rem}

  /* contact */
  .contact{height:51.8rem}
  .contact-bg{display:none}
  .contact .sec-title{top:3.1rem;left:7.8rem;right:7.8rem;font-size:2.4rem;line-height:2.6rem;white-space:normal}
  .contact-sub{left:5.4rem;top:9.9rem;width:28.2rem;font-size:1.6rem;line-height:2.07rem}
  .lead-form{left:2.6rem;top:15.5rem;width:33.8rem}
  .field{height:3.1rem;margin-bottom:1.6rem;border-radius:.6rem}
  .field-ta{height:7rem;margin-bottom:0}
  .field input,.field textarea{padding:0 2rem;font-size:1.2rem}
  .field textarea{padding-top:.8rem;line-height:1.57rem}
  .field > span{right:2rem;top:.9rem;font-size:1.2rem;line-height:1.57rem}
  .field-ta > span{top:.8rem}
  .consent{margin-top:1.1rem;height:1.3rem;font-size:1rem;line-height:1.3rem}
  .consent i{width:1.1rem;height:1.1rem;border-width:.1rem;border-radius:.3rem;margin-left:.6rem}
  .consent input:checked + i::after{left:.25rem;top:.05rem;width:.3rem;height:.6rem;border-width:0 .12rem .12rem 0}
  .lead-form .btn{margin-top:1.3rem;box-shadow:0 .4rem .4rem rgba(0,0,0,.25)}
  .form-msg{font-size:1.2rem;margin-top:1rem}

  /* floating */
  .floating{right:.6rem;bottom:4rem;gap:.8rem}
  .floating a{width:4.2rem;height:4.2rem}
  .float-wa img{width:4.2rem;height:4.2rem}
  .float-phone{box-shadow:0 .4rem .4rem rgba(0,0,0,.25)}
  .float-phone img{width:2rem;height:2rem}
}

/* ==========================================================================
   INNER PAGES — desktop
   ========================================================================== */
.header-light .main-nav{color:var(--dark)}
.header-light .main-nav a.active::before{background:var(--blue)}
.header-light .btn-outline{border-color:var(--lblue);color:var(--lblue)}

.page-hero{position:relative;height:69.1rem;overflow:hidden;background:#fff}
.page-hero .wrap{height:100%}
.page-hero-img{--w:max(242.4rem,100vw + 20rem);position:absolute;left:calc(94.4rem - var(--w) / 2);top:24.8rem;width:var(--w);height:42.9rem;object-fit:cover}
.page-hero-grad{position:absolute;left:calc(96rem - 50vw);top:33.6rem;width:100vw;height:35.5rem;background:linear-gradient(180deg,rgba(22,32,51,0) 0%,#162033 100%)}
.page-hero h1{position:absolute;right:6.2rem;top:47.9rem;width:172.5rem;font-size:6.1rem;line-height:7.98rem;font-weight:700;color:var(--bg);text-align:right;white-space:nowrap}
.page-hero .lead{position:absolute;right:6.2rem;top:59.2rem;width:152.5rem;font-size:3.1rem;line-height:4.05rem;color:#fff;text-align:right}
.hero-adv{height:95.6rem}
.hero-adv .page-hero-img,.hero-pub .page-hero-img{--w:max(216.6rem,100vw + 20rem);left:calc(97.3rem - var(--w) / 2);top:24.3rem;width:var(--w);height:71.3rem}
.hero-adv .page-hero-grad{top:22.7rem;height:72.9rem}
.hero-adv h1{top:74.6rem}
.hero-adv .lead{top:83rem;width:151.8rem;color:var(--bg)}
.hero-pub{height:87.8rem;overflow:visible;overflow-x:clip}
.hero-pub .page-hero-img{height:63.5rem}
.hero-pub .page-hero-grad{top:22.7rem;height:65.1rem}
.hero-pub h1{top:65.1rem}
.hero-pub .lead{top:73rem;width:130.6rem;color:var(--bg)}
.blob{position:absolute}
.blob-pub{left:4.4rem;top:47.9rem;width:53rem;height:53rem;z-index:2}
.blob-phone{display:none}

.tb{position:absolute}
.tb h3{font-size:3.02rem;line-height:3.95rem;font-weight:700;color:var(--blue);white-space:nowrap;text-align:right}
.tb :is(p,div){font-size:2.745rem;line-height:3.59rem;color:var(--gray);text-align:right;white-space:pre-line}
.tb ul{margin:0;padding:0 3.6rem 0 0;list-style:disc;white-space:normal}
.tb li{white-space:pre-line}

/* About */
.about-intro{position:relative;height:65.4rem}
.about-intro p{position:absolute;right:6.3rem;top:5rem;width:158.6rem;font-size:3.1rem;line-height:4.05rem;color:var(--gray);text-align:right;white-space:pre-line}
.about-gray{position:relative;height:308.7rem;background:var(--bg)}
.blob-pc{left:0;top:118.6rem;width:88.6rem;height:88.6rem;opacity:.15}
.about-gray .tb1{right:6.1rem;top:3.7rem;width:113.9rem}
.about-gray .tb1 :is(p,div){margin-top:3.65rem}
.about-gray .tb2{right:5.9rem;top:103rem;width:90.5rem}
.about-gray .tb2 :is(p,div){margin-top:3.25rem}
.about-gray .tb3{right:6.8rem;top:218.1rem;width:81.9rem}
.about-gray .tb3 :is(p,div){margin-top:2.6rem}
.about-clients{height:84.9rem;background:#fff}
.about-clients .sec-title{top:13.9rem}
.about-clients .clients-carousel{top:35.1rem;left:5.1rem}
.about-faq{height:200.6rem}
.about-faq .sec-title{top:0;right:15.8rem;left:auto;text-align:right}
.about-faq .faq-list{top:14rem;left:15.5rem;width:160.7rem}
.about-faq .faq-a{padding:1.6rem 3.8rem 1.6rem 54rem}
.about-faq .faq-a-w2{padding-left:26.6rem}
.about-faq .faq-a-w3{padding-left:11.5rem}
.faq-a-tall{min-height:16.9rem}
.faq-a-taller{min-height:19.3rem}

/* Contact variants */
.contact{z-index:1}
.contact-4 .field:nth-child(4){margin-bottom:0}
.contact-4 .consent{margin-top:4rem}
.contact-4 .lead-form .btn{margin-top:8.2rem}
.contact-nograd .contact-bg::before{display:none}

/* Advertisers */
.adv-features{position:relative;height:258.8rem;overflow:hidden}
.symbol{position:absolute}
.symbol-3{left:-48.5rem;top:49rem;width:84rem;height:83.1rem;opacity:.2}
.symbol-4{left:154.2rem;top:171.8rem;width:68.4rem;height:68.6rem;opacity:.15;transform:rotate(1deg)}
.feature{position:absolute;width:61.4rem}
.feature img{position:absolute;right:0;top:0;width:12rem;height:12rem}
.feature h3{position:absolute;right:0;top:12rem;font-size:3.02rem;line-height:3.95rem;font-weight:700;color:var(--blue);white-space:nowrap}
.feature p{position:absolute;right:0;top:18.5rem;width:54.8rem;font-size:2.745rem;line-height:3.59rem;color:var(--gray);text-align:right}
.f-r1,.f-r2,.f-r3,.f-r4{right:32.9rem}
.f-r1 img,.f-r2 img,.f-r3 img,.f-r4 img{right:-.7rem}
.f-l1,.f-l2,.f-l3,.f-l4{right:101.7rem}
.f-r1,.f-l1{top:13.2rem}
.f-r2,.f-l2{top:64.2rem}
.f-r3{top:115.2rem}
.f-l3{top:111.3rem}
.f-l3 h3{top:14rem}
.f-l3 p{top:22.4rem}
.f-r4{top:168.2rem}
.f-r4 p{width:58.2rem}
.f-l4{top:168.1rem}
.f-l4 h3{top:12.1rem}
.f-l4 p{top:18.6rem;width:61rem}
.f-c5{right:40.7rem;top:217.3rem;width:110.6rem}
.f-c5 h3{right:15.7rem;top:4rem}
.f-c5 p{right:15.7rem;top:10.5rem;width:94.9rem}

/* Blue banner */
.blue-banner{position:relative;height:73.9rem;overflow:hidden}
.blue-banner .wrap{height:100%}
.banner-grad{position:absolute;left:0;right:0;top:0;height:96.1rem;background:linear-gradient(180deg,rgba(37,99,235,0) 0%,#2563EB 100%);pointer-events:none}
.banner-img{--w:max(242.4rem,100vw + 20rem);position:absolute;left:calc(94.4rem - var(--w) / 2);top:34.6rem;width:var(--w);height:42.9rem;overflow:hidden}
.banner-img img{width:100%;height:100%;object-fit:cover}
.banner-img::after{content:"";position:absolute;inset:0;background:rgba(37,99,235,.74)}
.banner-symbol{position:absolute;left:85.1rem;top:24.8rem;width:21.8rem;height:21.5rem}
.blue-banner h2{position:absolute;left:26.9rem;top:49.9rem;width:138.2rem;font-size:6.1rem;line-height:7.98rem;font-weight:700;color:#fff;text-align:center}
.banner-pub{height:57.7rem}
.banner-pub .banner-img{top:16.8rem}
.banner-pub .banner-symbol{top:7rem}
.banner-pub h2{top:32.1rem}

/* Publishers */
.pub-body{position:relative;height:207.7rem}
.pub-body .tb1{right:6.2rem;top:9.9rem;width:174.4rem}
.pub-body .tb2{right:6.2rem;top:38.5rem;width:173.6rem}
.pub-body .tb3{right:6.2rem;top:115.4rem;width:169.3rem}
.pub-body .tb :is(p,div){margin-top:2.85rem}
.models{position:absolute;left:50%;margin-left:-96rem;top:88.9rem;width:192rem;height:21.7rem;background:var(--bg)}
.model{position:absolute;top:3.7rem;text-align:center}
.model b{display:block;font-size:9rem;line-height:11.77rem;font-weight:800;letter-spacing:-.8rem;color:var(--blue)}
.model span{display:block;font-size:2.745rem;line-height:3.59rem;font-weight:600;color:var(--lblue);margin-top:-1.4rem}
.model-cpa{left:121.1rem;width:45.4rem}
.model-cpl{left:79.6rem;width:37.9rem}
.model-cpc{left:28.1rem;width:48rem}
.model-line{position:absolute;top:3.2rem;width:.8rem;height:16rem;background:var(--lblue)}
.line-a{left:119.2rem}
.line-b{left:72.3rem}
.pub-cta{position:absolute;left:26.3rem;top:185.2rem;width:138.5rem;font-size:2.745rem;line-height:3.59rem;font-weight:700;color:var(--blue);text-align:center}

/* ==========================================================================
   INNER PAGES — phone
   ========================================================================== */
@media (max-width:820px){
  .header-light .btn-outline{border-color:var(--dark);color:var(--dark)}
  .page-hero{height:40.3rem}
  .page-hero-img{left:-6.8rem;top:13.1rem;width:54.4rem;height:27.1rem}
  .page-hero-grad{left:0;top:12.2rem;width:39rem;height:28.1rem}
  .page-hero h1{right:1.5rem;top:31.4rem;width:37.5rem;font-size:2rem;line-height:2.62rem;font-weight:600}
  .page-hero .lead{right:1.6rem;top:35rem;width:36rem;font-size:1.4rem;line-height:1.83rem;font-weight:300}
  .hero-adv{height:32rem}
  .hero-adv .page-hero-img,.hero-pub .page-hero-img{left:-2.8rem;top:5.4rem;width:48.6rem;height:26.6rem}
  .hero-adv .page-hero-grad{top:6.6rem;width:39rem;height:25.4rem}
  .hero-adv h1{top:22rem}
  .hero-adv .lead{top:24.9rem;right:1.5rem;width:36.5rem}
  .hero-pub{height:33.7rem}
  .hero-pub .page-hero-grad{top:6.6rem;width:39rem;height:27.1rem}
  .hero-pub h1{top:21.4rem}
  .hero-pub .lead{top:24.1rem;right:1.5rem;width:26.2rem}
  .blob-pub{left:-.5rem;top:24rem;width:12.3rem;height:12.3rem}

  .tb h3{font-size:1.3rem;line-height:1.7rem;white-space:normal}
  .tb :is(p,div){font-size:1.2rem;line-height:1.57rem}

  .about-intro{height:auto;padding:9.5rem 0 3.5rem}
  .about-intro p{position:static;margin:0 auto;width:34.8rem;font-size:1.4rem;line-height:1.83rem;font-weight:300;color:var(--dark);text-align:center}
  .blob-phone{display:block;left:14rem;top:.1rem;width:9.3rem;height:9.3rem;opacity:.15}
  .blob-pc{display:none}
  .about-gray{height:auto;padding:9.8rem 0 7.3rem}
  .about-gray .tb{position:static;width:auto;padding:0 1.6rem 0 1.5rem}
  .about-gray .tb1 :is(p,div){margin-top:1rem}
  .about-gray .tb2{margin-top:0}
  .about-gray .tb2 :is(p,div){margin-top:1.2rem}
  .about-gray .tb3{margin-top:2.2rem}
  .about-gray .tb3 :is(p,div){margin-top:1.1rem}
  .about-clients{height:34.2rem}
  .about-clients .sec-title{top:7.5rem}
  .about-clients .clients-carousel{top:14.9rem;left:5rem}
  .about-clients .arrows{top:14.8rem}
  .about-faq{height:auto;padding:0 0 9.9rem}
  .about-faq .wrap{padding-top:3.9rem}
  .about-faq .sec-title{top:0;right:0;left:0;text-align:center}
  .about-faq .faq-list{position:static;margin:0 auto;width:33.8rem}
  .faq-a-tall,.faq-a-taller{min-height:6.2rem}
  .about-faq .faq-a,.about-faq .faq-a-w2,.about-faq .faq-a-w3{padding:.5rem .8rem .5rem .6rem}

  .contact-4 .consent{margin-top:1.1rem}
  .contact-4 .lead-form .btn{margin-top:1.3rem}

  .adv-features{height:auto;padding:3.2rem 1.5rem 1.3rem;overflow:hidden}
  .adv-features .wrap{display:flex;flex-direction:column;width:auto}
  .symbol-3{left:-8.1rem;top:0;width:13.1rem;height:12.9rem}
  .symbol-4{display:none}
  .feature{position:relative;right:auto;left:auto;top:auto;width:auto;padding-top:7.2rem;margin-bottom:4.4rem}
  .feature img{width:6rem;height:6rem;right:-.1rem}
  .feature h3,.feature p{position:static;width:auto;white-space:normal}
  .feature h3{font-size:1.3rem;line-height:1.7rem}
  .feature p{margin-top:1rem;font-size:1.2rem;line-height:1.57rem}
  .f-c5{padding-top:7.2rem}
  .f-r1{order:1}.f-l1{order:2}.f-l2{order:3}.f-r2{order:4}.f-r3{order:5}.f-l3{order:6}.f-r4{order:7}.f-l4{order:8}.f-c5{order:9;margin-bottom:0}

  .blue-banner{height:16.4rem}
  .banner-grad{margin-left:-20.75rem;width:41.5rem;height:20.3rem}
  .banner-img{left:-6.4rem;top:1.3rem;width:51.5rem;height:15.1rem}
  .banner-symbol{left:17.2rem;top:-1rem;width:4.6rem;height:4.6rem}
  .blue-banner h2{left:.7rem;top:6rem;width:36.5rem;font-size:2.4rem;line-height:2.6rem}
  .banner-pub{height:20rem}
  .banner-pub .banner-img{top:5.2rem}
  .banner-pub .banner-symbol{top:2.9rem}
  .banner-pub h2{top:8.6rem}

  .pub-body{height:auto;padding:5.8rem 0 1.4rem}
  .pub-body .tb{position:static;width:auto;padding:0 1.5rem}
  .pub-body .tb :is(p,div){margin-top:1rem}
  .pub-body .tb2{margin-top:1.2rem}
  .models{position:static;margin:3.3rem 0 0;width:auto;height:auto;background:none;display:flex;flex-direction:column;gap:1.2rem}
  .model{position:static;width:auto;height:11.7rem;padding-top:.8rem;background:var(--bg)}
  .model b{font-size:6.2rem;line-height:8.11rem;letter-spacing:-.55rem}
  .model span{font-size:1.89rem;line-height:2.47rem;margin-top:-.9rem}
  .model-line{display:none}
  .pub-body .tb3{margin-top:4.6rem}
  .pub-body .tb3 :is(p,div){padding-left:4.3rem}
  .pub-cta{position:static;width:auto;margin-top:4.4rem;font-size:1.3rem;line-height:1.7rem}
}