/* =====================================================================================
   MOBILE + TABLET (≤1199px) — Figma "Mobile 375 - Homepage" (757:8804), menu 2494:36514
   Phone: 16px gutters. Tablet (600–1199): 32px gutters, a wider single column, and 2 columns
   where the content allows it (Why us, cases, blog, footer contacts). Desktop starts at 1200px.
   ===================================================================================== */
.burger,.mmenu,.wy-msvg,.wy-mpulse,.p7-mlines,.p7-mlab{display:none}
@media (max-width:1199px){
  :root{--gx:16px;--mw:720px}
  body.menu-open{overflow:hidden}

  /* ---------- header + burger ---------- */
  .header{height:60px;padding:16px 0;z-index:30}
  .logo{width:28px;height:28px}
  .contact{display:none}
  .burger{display:flex;flex-direction:column;justify-content:center;gap:8px;width:40px;height:40px;padding:0;border:0;background:none;cursor:pointer;position:relative;z-index:1002}
  .burger i{display:block;width:40px;height:2px;background:#fff;border-radius:1px;transition:transform .4s var(--ease),opacity .3s}
  body.menu-open .burger i:nth-child(1){transform:translateY(5px) rotate(45deg)}
  body.menu-open .burger i:nth-child(2){transform:translateY(-5px) rotate(-45deg)}
  body.menu-open .header{position:fixed!important;left:0;right:0;top:0;padding:16px var(--gx);background:#131313;z-index:1001}

  /* ---------- menu overlay ---------- */
  .mmenu{display:flex;flex-direction:column;justify-content:space-between;position:fixed;inset:0;z-index:1000;background:#131313;padding:60px var(--gx) 48px;
    opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility 0s .35s;overflow-y:auto}
  body.menu-open .mmenu{opacity:1;visibility:visible;transition:opacity .35s var(--ease)}
  .mm-body{position:relative;flex:1;max-width:var(--mw);width:100%;margin:0 auto}
  .mm-panel{position:absolute;inset:0 0 auto 0;display:flex;flex-direction:column;gap:16px;opacity:0;transform:translateX(24px);pointer-events:none;transition:opacity .3s var(--ease),transform .4s var(--ease)}
  .mm-panel.on{opacity:1;transform:none;pointer-events:auto}
  .mm-panel.back{transform:translateX(-24px)}
  .mm-crumbs{display:flex;flex-wrap:wrap;gap:16px;font:500 16px/1.5 var(--mono);color:#959595;padding-top:8px}
  .mm-crumbs button{all:unset;cursor:pointer;color:#959595}.mm-crumbs button:hover{color:#fff}
  .mm-crumbs i{font-style:normal}
  .mm-crumbs b{font-weight:500;color:#dcdcdc}.mm-crumbs b.br{flex-basis:100%}
  .mm-list{display:flex;flex-direction:column}
  .mm-item{all:unset;box-sizing:border-box;display:flex;align-items:center;min-height:56px;padding:16px 0;border-bottom:1px solid #2f2f2f;cursor:pointer;font:500 16px/1.5 var(--mono);color:#dcdcdc}
  .mm-item span{flex:1}.mm-item svg{flex:none;color:#fff}
  .mm-item:hover{color:#fff}
  .mm-panel[data-k="solutions"] .mm-item{min-height:64px}
  .mm-list.cards{gap:8px}
  .mm-card{display:flex;align-items:center;gap:16px;padding:16px;border-radius:8px;background:#191919;font:400 16px/1.5 var(--rubik);color:#fff;transition:background .25s}
  .mm-card svg{flex:none;color:var(--yellow)}
  .mm-card:hover{background:#222}
  .mm-panel.on>*{animation:mmIn .45s var(--ease) both}
  .mm-panel.on .mm-list>*{animation:mmIn .45s var(--ease) both}
  .mm-panel.on .mm-list>:nth-child(2){animation-delay:.04s}.mm-panel.on .mm-list>:nth-child(3){animation-delay:.08s}.mm-panel.on .mm-list>:nth-child(4){animation-delay:.12s}.mm-panel.on .mm-list>:nth-child(5){animation-delay:.16s}.mm-panel.on .mm-list>:nth-child(6){animation-delay:.2s}
  @keyframes mmIn{from{opacity:0;transform:translateY(8px)}}
  .mm-ctas{display:flex;justify-content:space-between;gap:16px;max-width:var(--mw);width:100%;margin:32px auto 0}
  .mm-cta{flex:0 1 153px;height:153px;padding:12px;border-radius:8px;display:flex;flex-direction:column;justify-content:space-between;font:500 16px/1.5 var(--mono)}
  .mm-cta svg{align-self:flex-end}
  .mm-cta.ghost{background:rgba(0,0,0,.2);box-shadow:inset 0 0 0 1px #f6f6f6;color:#f6f6f6}
  .mm-cta.solid{background:#fff;color:#131313;box-shadow:6.4px 8px 22.4px rgba(5,5,5,.29),22.4px 35.2px 41.6px rgba(5,5,5,.26)}

  /* ---------- hero ---------- */
  .frame{max-width:calc(var(--mw) + var(--gx)*2);margin:0 auto;padding:0 var(--gx) 56px;gap:32px}
  .copy{display:contents}
  h1{order:1;margin-top:-8px;font-size:32px;letter-spacing:.48px}
  .stage{order:2;width:86%}
  .desc{order:3;align-self:flex-end;margin-top:-63px;width:250px;padding:24px;gap:8px}
  .desc .t{gap:8px}
  .desc p{font-size:14px}
  .dots{width:100%}.dots button{flex:1;width:auto}
  .lead{order:4;width:auto;margin-top:0}
  .tiles{order:5;flex-direction:column;align-items:stretch;gap:20px}
  .btn{width:100%;height:56px;justify-content:space-between;padding:16px 16px 16px 20px}
  .badges{order:6}

  /* ---------- where are you now (mobile layout, just wider on tablet) ---------- */
  .frame2{max-width:calc(var(--mw) + var(--gx)*2);margin:0 auto;padding:0 var(--gx) 80px}
  .wy-head{gap:8px}
  .wy-head .eyebrow{font-size:14px;letter-spacing:.21px}
  .wy-head h2{font-size:32px;letter-spacing:.48px}
  .wy-row{margin-top:24px;gap:8px;counter-reset:wy}
  .wy-card{height:550px;padding:20px;border-radius:8px;background:#191919;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;display:flex;flex-direction:column;justify-content:space-between;cursor:default}
  .wy-card::before,.wy-card::after{display:none}
  .wy-card .txt{max-width:calc(100% - 92px);gap:12px;counter-increment:wy}
  .wy-card .txt::before{content:"0" counter(wy);font:500 16px/1.5 var(--mono);color:var(--yellow)}
  .wy-card p{color:#dcdcdc}
  .wy-cta,.wy-card.on .wy-cta{display:flex!important;position:relative;inset:auto;width:calc(100% - 92px);min-width:0;max-width:233px;height:128px;min-height:0;margin:0;padding:8px;
    opacity:1;transform:none;pointer-events:auto;background:rgba(0,0,0,.2);box-shadow:inset 0 0 0 1px var(--yellow);color:var(--yellow);transition:background .45s var(--ease),color .45s var(--ease),box-shadow .45s}
  .wy-card.on .wy-cta{background:var(--yellow);color:#131313;box-shadow:none}
  .wy-msvg{display:block;position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:3}
  .wy-mpulse{display:block;position:absolute;left:0;top:0;width:78px;height:78px;margin:-39px 0 0 -39px;pointer-events:none;z-index:4;will-change:transform}
  .wy-mpulse i{position:absolute;left:50%;top:50%;border-radius:50%;border:1px solid var(--yellow);transform:translate(-50%,-50%)}
  .wy-mpulse i:nth-child(1){width:78px;height:78px;opacity:.15;animation:ring 2.4s ease-in-out infinite}
  .wy-mpulse i:nth-child(2){width:57px;height:57px;opacity:.5;animation:ring 2.4s ease-in-out infinite .2s}
  .wy-mpulse i:nth-child(3){width:36px;height:36px;animation:ring 2.4s ease-in-out infinite .4s}
  .wy-mpulse b{position:absolute;left:50%;top:50%;width:13px;height:13px;border-radius:50%;background:#ffe542;transform:translate(-50%,-50%);box-shadow:0 0 10px rgba(255,229,66,.5)}

  /* ---------- statement ---------- */
  .frame3{max-width:calc(var(--mw) + var(--gx)*2);margin:0 auto;padding:0 var(--gx) 80px}
  .st-text{font-size:28px;letter-spacing:.42px}
  .chip{width:24px;height:24px;border-radius:4px;margin:0 6px;vertical-align:calc(.36em - 12px)}.chip svg{width:16px;height:16px;margin:4px}

  /* ---------- stacked services ---------- */
  .page4{--top:16px}
  .p4-head{max-width:calc(var(--mw) + var(--gx)*2);margin:0 auto;padding:0 var(--gx) 24px;display:flex;flex-direction:column;gap:24px}
  .p4-head h2{font-size:28px;letter-spacing:.42px}
  .p4-head p{font-size:16px;color:#dcdcdc}
  .p4-item{max-width:var(--mw);margin:0 auto 10vh;padding:0 var(--gx);box-sizing:content-box}
  .p4-card{display:flex;flex-direction:column;gap:20px;padding:24px;border-radius:24px;background:#191919}
  .p4-panel,.p4-t{display:contents}
  .p4-t h3{order:1;font-size:20px;letter-spacing:.3px}
  .p4-img{order:2;width:100%;height:auto;aspect-ratio:295/240;border-radius:8px;padding:12px 0 0 12px}
  .p4-img.full{padding:0}
  .p4-t p{order:3;color:#fff}
  .p4-tags{order:4}
  .p4-tag:first-child{color:var(--yellow)}
  .p4-cta{order:5;align-self:stretch;width:auto;height:56px;min-height:0;padding:16px 16px 16px 16px;flex-direction:row-reverse;justify-content:space-between;align-items:center}
  .p4-cta svg{width:20px;height:20px;align-self:center}

  /* ---------- Atlas (white) ---------- */
  .frame5{max-width:calc(var(--mw) + var(--gx)*2);margin:0 auto;padding:48px var(--gx);gap:32px}
  .frame5 h2{order:1;font-size:20px;letter-spacing:.3px}
  .p5-shot.s1{order:2}.p5-shot.s2{order:3}
  .p5-lead{order:4}
  .p5-big{order:5;font-size:28px;letter-spacing:.42px}
  .p5-btn{order:6;display:flex;width:auto!important;height:56px;margin:0!important;padding:16px 16px 16px 20px;flex-direction:row-reverse;justify-content:space-between;align-items:center}
  .p5-btn.ghost{order:7;margin-top:-12px!important}
  .p5-btn svg{align-self:center;width:20px;height:20px}

  /* ---------- Why us ---------- */
  .frame6{max-width:calc(1000px + var(--gx)*2);margin:0 auto;padding:40px var(--gx) 80px}
  .p6-head{gap:24px}
  .p6-eyebrow{font-size:14px!important;letter-spacing:.21px}
  .p6-head h2{font-size:20px!important;letter-spacing:.3px}
  .p6-about{display:none}
  .p6-grid{grid-template-columns:1fr;gap:8px;margin-top:24px}
  .p6-card{min-height:350px;padding:24px;gap:64px}
  .p6-num{font-size:40px!important;letter-spacing:.6px}
  .p6-card h3{font-size:20px!important;color:#dcdcdc}
  .p6-card p{font-size:16px!important}
  .p6-link{font-size:16px!important}
  .p6-map{order:10;grid-column:auto;aspect-ratio:343/274}

  /* ---------- AI product heading + How we build ---------- */
  .frame7{max-width:calc(var(--mw) + var(--gx)*2);margin:0 auto;padding:0 var(--gx) 48px}
  .p7-h{font-size:28px;letter-spacing:.42px;margin-bottom:80px;text-align:center}
  .p7-dia{display:grid;grid-template-columns:minmax(0,1fr) 343px minmax(0,1fr);grid-template-rows:auto 696px auto;row-gap:24px;margin-top:0;height:auto}
  .p7-copy{grid-column:1/-1;grid-row:1;gap:8px}
  .p7-eyebrow{font-size:14px!important;letter-spacing:.21px}
  .p7-copy h3{font-size:20px!important;letter-spacing:.3px}
  .p7-cta{grid-column:1/-1;grid-row:3;margin-top:16px;height:56px!important;flex-direction:row-reverse;justify-content:space-between;align-items:center;padding:16px}
  .p7-cta svg{align-self:center;width:20px;height:20px}
  .p7-bg{display:block;grid-column:1/-1;grid-row:2;position:relative;inset:auto;margin:120px calc(var(--gx) * -1) 0;height:336px;
    background:radial-gradient(60% 50% at 50% 50%,rgba(40,140,95,.22),rgba(40,140,95,0) 75%);-webkit-mask:none;mask:none}
  .p7-labels{display:contents}
  .p7-labels span{grid-column:2;grid-row:2;align-self:start;justify-self:start;position:relative;font:500 16px/1.5 var(--mono);letter-spacing:0;text-transform:uppercase;color:#959595;z-index:1}
  .p7-labels span:last-child{margin-top:673px}
  .p7-labels .ai{color:#5de6b5;writing-mode:vertical-rl;margin:121px 0 0 319px;width:auto}
  .p7-mlab{display:block!important;grid-column:2;grid-row:2;align-self:start;justify-self:start;margin:351px 0 0 3px;font:500 16px/1.5 var(--mono);text-transform:uppercase;color:#5de6b5;writing-mode:vertical-rl;transform:rotate(180deg);z-index:1}
  .p7-node[data-i="0"]{--mx:244px;--my:1px}.p7-node[data-i="1"]{--mx:3px;--my:120px}.p7-node[data-i="2"]{--mx:123px;--my:121px}.p7-node[data-i="3"]{--mx:123px;--my:241px}
  .p7-node[data-i="4"]{--mx:123px;--my:361px}.p7-node[data-i="5"]{--mx:243px;--my:361px}.p7-node[data-i="6"]{--mx:243px;--my:481px}.p7-node[data-i="7"]{--mx:243px;--my:601px}
  .p7-mlines path{fill:none;stroke:#5de6b5;stroke-opacity:.75;stroke-width:1;stroke-dasharray:6 5;animation:flowM 1.6s linear infinite}
  .p7-mlines path.w{stroke:#fff;stroke-opacity:.6}
  .p7-mlines path.s{stroke:#959595;stroke-dasharray:none;animation:none}
  @keyframes flowM{to{stroke-dashoffset:-22}}
  .p7-lines{display:none}
  .p7-mlines{display:block;grid-column:2;grid-row:2;position:relative;width:343px;height:696px;pointer-events:none;overflow:visible;z-index:0}
  .p7-node{grid-column:2;grid-row:2;align-self:start;justify-self:start;position:relative;left:auto!important;top:auto!important;width:96px;height:96px;min-height:0;padding:12px;gap:6px;
    font:500 12px/1.5 var(--mono);letter-spacing:0;text-transform:none;margin:var(--my) 0 0 var(--mx);z-index:2}
  .p7-node .p7-ic{width:32px;height:32px}
  .p7-node .p7-tip{display:none}

  /* ---------- cases: white panel, vertical list ---------- */
  .page8{background:#fff!important;color:#131313;border-radius:28px 28px 0 0;overflow:hidden}
  .frame8{max-width:calc(1000px + var(--gx)*2);margin:0 auto;padding:48px var(--gx);display:flex;flex-direction:column;gap:40px}
  .p8-head{display:contents}
  .p8-head>div{order:1;gap:8px}
  .p8-eyebrow{font-size:14px!important;letter-spacing:.21px;color:#2f1ec1!important}
  .p8-head h2{font-size:28px!important;letter-spacing:.42px;color:#131313}
  .p8-wrap{order:2;margin:0}
  .p8-track{display:grid;grid-template-columns:1fr;gap:24px;padding:0;overflow:visible;cursor:default}
  .p8-card{width:auto;height:auto;aspect-ratio:1}
  .p8-card.clone,.p8-end,.p8-next,.p8-dots{display:none!important}
  .p8-card:not(.clone):nth-child(n+4 of :not(.clone)){display:none}
  .p8-over{height:60%;padding:16px}
  .p8-over h3{width:auto;font-size:20px!important}
  .p8-all{order:3;height:56px;justify-content:space-between;padding:16px 16px 16px 20px;background:#2f1ec1;color:#fff;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}

  /* ---------- FAQ ---------- */
  .frameFaq{max-width:calc(var(--mw) + var(--gx)*2);margin:0 auto;padding:48px var(--gx) 80px}
  .fq-left{display:none}
  .fq-right h2{font-size:56px;letter-spacing:.84px}
  .fq-q{padding:24px 0}
  .fq-q span{font-size:20px;color:#dcdcdc}
  .fq-item.on .fq-q span{color:#fff}
  .fq-ic,.fq-ic svg{width:40px;height:40px}
  .fq-a-in{padding:0 0 24px 24px}

  /* ---------- testimonials ---------- */
  .frame9{padding:48px 0}
  .p9-head{margin:0 var(--gx)}
  .p9-eyebrow{font-size:14px!important;letter-spacing:.21px}
  .p9-head h2{font-size:28px!important;letter-spacing:.42px}
  .p9-nav{display:none}
  .p9-track{padding:0 var(--gx);scroll-padding-left:var(--gx);gap:16px;margin-top:32px}
  .t-slide{width:min(313px,84vw);height:auto}
  .t-slide.video{flex-direction:column;gap:4px}
  .t-media{width:100%;height:auto;aspect-ratio:313/222}
  .t-play{width:100px;height:100px}
  .t-body{padding:24px;border-radius:8px;background:#191919;gap:20px;justify-content:flex-start}
  .t-slide h3{font-size:20px!important;letter-spacing:.3px}
  .t-role{font-size:16px!important;margin-top:8px}
  .t-logo{width:48px;height:48px}
  .t-quote p{font-size:16px!important}
  .t-mark{font-size:16px!important;width:auto!important;height:auto!important;line-height:1.5}
  .t-quote.wide{padding-left:0}.t-quote.wide .t-mark{position:static}.t-quote.wide p{padding-left:4px}
  .t-foot{flex-direction:column;align-items:stretch;gap:20px}
  .t-score{font-size:40px!important;align-self:flex-end}
  .t-cta{width:100%;height:56px;flex-direction:row-reverse;justify-content:space-between;align-items:center;padding:16px 16px 16px 20px}
  .t-cta svg{align-self:center;width:20px;height:20px}
  .t-slide.text{display:grid;grid-template-columns:minmax(0,221fr) minmax(0,88fr);grid-template-rows:auto auto auto auto;column-gap:4px;row-gap:0;position:relative}
  .t-slide.text .t-row{display:contents}
  .t-slide.text .t-ava{grid-column:1;grid-row:1;width:100%;height:auto;aspect-ratio:1}
  .t-slide.text::before{content:"";grid-column:2;grid-row:1;border-radius:8px;background:#191919}
  .t-slide.text::after{content:"";grid-column:1/-1;grid-row:2/5;margin-top:4px;border-radius:8px;background:#191919;z-index:0}
  .t-slide.text .t-row>div,.t-slide.text .t-quote,.t-slide.text .t-foot{grid-column:1/-1;position:relative;z-index:1;padding:0 24px}
  .t-slide.text .t-row>div{grid-row:2;padding-top:28px}
  .t-slide.text .t-quote{grid-row:3;padding-top:20px}
  .t-slide.text .t-foot{grid-row:4;padding:20px 24px 24px}

  /* ---------- CTA (white) ---------- */
  .frameCta{max-width:calc(var(--mw) + var(--gx)*2);margin:0 auto;padding:48px var(--gx);gap:16px}
  .frameCta h2{font-size:40px!important;letter-spacing:.6px}
  .ct-tag{display:none!important}
  .ct-lead{font-size:16px!important}
  .ct-btn{margin-top:16px;height:153px}
  .ct-list{padding-top:16px;border-top:0;gap:20px!important}
  .ct-list ul{gap:20px}
  .ct-list li{font-size:16px!important;gap:8px!important;line-height:1.5}

  /* ---------- blog ---------- */
  .frameBlog{max-width:calc(1000px + var(--gx)*2);margin:0 auto;padding:48px var(--gx) 80px;display:flex;flex-direction:column;gap:32px}
  .bl-head,.bl-head>div{display:contents}
  .bl-head h2{order:1;font-size:28px!important;letter-spacing:.42px;margin-bottom:-16px}
  .bl-eyebrow{order:2;font:400 16px/1.5 var(--rubik)!important;text-transform:none!important;letter-spacing:0!important;color:#dcdcdc!important}
  .bl-grid{order:3;display:grid;grid-template-columns:1fr;gap:20px;margin:0;padding:0;overflow:visible;height:auto}
  .bl-card{width:auto;aspect-ratio:1}
  .bl-over{height:auto!important;padding:48px 24px 24px;-webkit-mask:none;mask:none}
  .bl-over h3{font-size:16px!important}
  .bl-all{order:4;height:56px;justify-content:space-between}

  /* ---------- footer ---------- */
  .frameFoot{max-width:calc(1000px + var(--gx)*2);margin:0 auto;padding:0 var(--gx) 48px;display:grid;grid-template-columns:minmax(0,1fr);gap:0}
  .ft-nav,.ft-big,.ft-bottom,.ft-contact,.ft-right,.ft-addr{display:contents}
  .ft-logo{grid-row:1;justify-self:start}
  .ft-logo-svg{width:40px;height:40px}
  .ft-big p{grid-row:2;margin-top:40px;width:auto;font-size:32px!important;letter-spacing:.48px}
  .ft-talk{grid-row:3;margin-top:24px;width:auto;height:153px}
  .ft-ind{grid-row:4;margin:40px calc(var(--gx) * -1) 0}
  .ft-track span{font-size:24px!important}
  .frameFoot::before{content:"";grid-row:5/7;grid-column:1;margin-top:40px;border-radius:8px;background:#191919}
  .ft-contact p.ft-addr{display:contents}
  .ft-contact p:not(.ft-addr){position:relative;grid-column:1;flex-direction:column;align-items:flex-start;gap:4px;padding:0 24px}
  .ft-contact p:nth-child(1){grid-row:5;margin-top:40px;padding-top:24px}
  .ft-contact p:nth-child(2){grid-row:6;padding-top:20px;padding-bottom:24px}
  .ft-contact .k{width:auto}
  .ft-contact a{line-height:40px}
  .ft-phones{grid-row:7;margin-top:8px;padding:24px;border-radius:8px;background:#191919;flex-direction:column;align-items:flex-start;gap:16px}
  .ft-phones a{line-height:40px}
  .ft-phones i{display:none}
  .ft-socs{grid-row:8;margin-top:40px;justify-content:space-between}
  .ft-nav nav{grid-row:9;margin-top:40px;justify-content:space-between;gap:20px}
  .ft-addr span:first-child{grid-row:10;margin-top:40px}
  .ft-addr i{display:none}
  .ft-addr span:last-child{grid-row:11;margin-top:24px}
  .ft-addr span{font:400 16px/1.5 var(--rubik);color:#959595}
}
/* tablet: wider gutters, two columns where the content allows it */
@media (min-width:600px) and (max-width:1199px){
  :root{--gx:32px}
  .desc{width:300px}
  .p6-grid{grid-template-columns:1fr 1fr}
  .p6-map{grid-column:1/-1;aspect-ratio:686/360}
  .p8-track{grid-template-columns:1fr 1fr}
  .p8-card:not(.clone):nth-child(n+4 of :not(.clone)){display:block}
  .p8-card:not(.clone):nth-child(n+5 of :not(.clone)){display:none}
  .bl-grid{grid-template-columns:1fr 1fr}
  .bl-card:nth-child(3){grid-column:1/-1;aspect-ratio:2/1}
  .ct-list{flex-direction:row!important}
  .frameFoot{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:8px}
  .ft-logo,.ft-big p,.ft-talk,.ft-ind,.ft-socs,.ft-nav nav,.ft-addr span{grid-column:1/-1}
  .frameFoot::before{grid-column:1}
  .ft-contact p:not(.ft-addr){grid-column:1}
  .ft-phones{grid-row:5/7;grid-column:2;margin-top:40px}
  .ft-socs{grid-row:8}
}
@media (min-width:900px) and (max-width:1199px){
  .bl-grid{grid-template-columns:repeat(3,1fr)}
  .bl-card:nth-child(3){grid-column:auto;aspect-ratio:1}
}
