
:root{--yellow:#ffd400;--ink:#111;--muted:#3f3f3f;--soft:#f5f5f3;--line:#d8d8d4}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#e8e8e6;font-family:Montserrat,Arial,sans-serif;color:var(--ink)}img{display:block;max-width:100%}button,a{font:inherit}a{color:inherit;text-decoration:none}
.site{width:min(1280px,100%);margin:auto;background:white;overflow:hidden;box-shadow:0 0 0 1px #ddd}
.container{width:1070px;max-width:calc(100% - 60px);margin:auto}
.header{height:96px;display:flex;align-items:center;justify-content:space-between;padding:0 104px;background:#fff}
.header .brand{width:138px}.header-social{display:flex;gap:18px;align-items:center}.header-social img{width:26px;height:26px;object-fit:contain;filter:invert(1)}
.slider{position:relative;overflow:hidden}.track{display:flex;transition:transform .6s cubic-bezier(.65,0,.35,1)}.slide{flex:0 0 100%}
.hero{height:477px}.hero .slide img{width:100%;height:477px;object-fit:cover}
.navbtn{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:46px;height:46px;border:0;background:transparent;cursor:pointer;padding:8px}.navbtn.prev{left:78px}.navbtn.next{right:78px}.navbtn.next img{transform:rotate(180deg)}.navbtn img{width:100%;height:100%;object-fit:contain}
.hero-intro{padding:36px 0 45px;position:relative;background:#fff}.hero-intro h1{margin:0;text-align:center;font-size:50px;line-height:1;letter-spacing:5px;font-weight:400;text-transform:uppercase}.hero-intro h1 strong{color:var(--yellow);font-weight:800}.hero-intro .lead{font-size:20px;text-align:center;margin:22px 0 44px}.hero-wa{position:absolute;right:102px;top:33px;width:64px;height:64px;border-radius:18px;background:#079d2a;display:grid;place-items:center}.hero-wa svg{width:38px;height:38px;fill:white}.pills{display:flex;justify-content:center;gap:16px;flex-wrap:wrap}.pill{background:var(--yellow);padding:13px 21px;border-radius:999px;text-transform:uppercase;font-size:13px;font-weight:800;letter-spacing:.8px}
.value{background:var(--soft);padding:38px 0 70px;border-top:1px solid #ddd}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.card{background:#fff;border:1.5px solid var(--yellow);border-radius:22px;position:relative}.card:before{content:"";position:absolute;top:-6px;left:50%;transform:translateX(-50%);width:92px;height:12px;border-radius:999px;background:var(--yellow)}.stat{height:111px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}.stat strong{font-size:34px;line-height:1;font-weight:800}.stat span{font-size:13px;margin-top:7px;max-width:210px}.value-row{display:grid;grid-template-columns:430px 1fr;gap:38px;margin-top:26px;align-items:center}.value-copy h2{font-size:25px;line-height:1.18;font-weight:500;text-transform:uppercase;margin:0 0 26px}.value-copy h2 strong{font-weight:800}.value-copy p{font-size:15.5px;line-height:2;margin:0 0 22px}.value-images{height:325px;position:relative}.value-images .back{position:absolute;left:0;top:0;width:505px;height:286px;object-fit:cover;border-radius:20px}.value-images .front{position:absolute;right:0;bottom:0;width:350px;height:252px;object-fit:cover;border-radius:20px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:15px;background:var(--yellow);border:6px solid #e0dfdc;border-radius:999px;padding:10px 18px 10px 22px;text-transform:uppercase;font-size:13px;font-weight:800;letter-spacing:1px;white-space:nowrap}.btn .circle{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#fff;font-size:16px}
.logo-section{height:300px;background:#fff;display:flex;align-items:center;position:relative}.logo-viewport{overflow:hidden;width:1070px;margin:auto}.logo-track{display:grid;grid-auto-flow:column;grid-template-rows:repeat(2,92px);grid-auto-columns:116px;gap:0 16px;transition:transform .5s}.logo-cell{display:grid;place-items:center;padding:14px}.logo-cell img{max-width:100px;max-height:58px;object-fit:contain}.logo-arrow{position:absolute;top:50%;transform:translateY(-50%);border:0;background:transparent;width:38px;cursor:pointer}.logo-arrow.prev{left:78px}.logo-arrow.next{right:78px}.logo-arrow.next img{transform:rotate(180deg)}
.panorama{height:390px;background:white}.panorama .pan-slide img{width:100%;height:390px;object-fit:cover}.panorama:after{content:"";position:absolute;bottom:-1px;left:50%;transform:translateX(-50%);width:70px;height:32px;background:#fff;clip-path:polygon(0 0,100% 0,50% 100%)}
.why,.solutions{background:var(--soft);padding:42px 0 55px}.section-title{text-align:center;text-transform:uppercase;font-size:24px;font-weight:500;margin:0 0 36px}.section-title strong{font-weight:800}.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.info-card{height:200px;padding:25px 22px}.info-card h3{font-size:16px;line-height:1.15;text-transform:uppercase;margin:0 0 23px}.info-card p{font-size:15px;line-height:1.55;margin:0}.cta-row{display:flex;justify-content:center;margin-top:34px}
.solution-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.solution-card{height:214px;padding:25px 40px}.solution-card h3{font-size:20px;line-height:1.1;text-transform:uppercase;font-weight:500;margin:0 0 17px}.solution-card p{font-size:15px;line-height:1.45;margin:0}
.vertical{height:825px;background:#fff;position:relative}.vertical .title{position:absolute;left:105px;top:96px;font-size:24px;line-height:1.18;text-transform:uppercase;font-weight:500}.vertical .title strong{font-weight:800}.v-copy{position:absolute;width:395px}.v-copy h3{font-size:20px;text-transform:uppercase;font-weight:500;margin:0 0 37px}.v-copy p{font-size:15px;line-height:2.1;margin:0}.v-img{position:absolute;border-radius:20px;object-fit:cover}.v1 .c1{left:105px;top:230px}.v1 .img1{left:555px;top:200px;width:620px;height:316px}.v1 .img2{left:105px;top:423px;width:620px;height:319px}.v1 .c2{left:771px;top:565px}.v2{background:#f8f8f7}.v2 .c1{left:105px;top:132px}.v2 .img1{left:555px;top:98px;width:620px;height:318px}.v2 .img2{left:105px;top:322px;width:620px;height:312px}.v2 .c2{left:771px;top:462px}.v2 .cta-row{position:absolute;left:0;right:0;bottom:70px;margin:0}
.cases{background:#fff;padding:58px 0 70px}.case-viewport{overflow:hidden}.case-track{display:flex;transition:transform .6s cubic-bezier(.65,0,.35,1)}.case-slide{flex:0 0 100%;display:grid;grid-template-columns:355px 1fr;gap:4px;padding:20px 68px 0 68px;min-height:550px}.case-copy{padding:15px 0 0 0}.case-logo{width:150px;height:80px;object-fit:contain;object-position:left center;margin:0 0 25px}.case-copy p{font-size:15px;line-height:1.9;width:320px;margin:0}.case-gallery{padding-left:0}.case-main{width:568px;height:306px;object-fit:cover;border-radius:18px}.case-thumbs{display:grid;grid-template-columns:2fr 1.05fr 1.05fr 1.05fr;gap:10px;margin-top:10px;width:568px}.case-thumbs img{width:100%;height:171px;object-fit:cover;border-radius:14px}.case-nav .prev{left:75px}.case-nav .next{right:75px}
.testimonials{background:var(--soft);padding:72px 0 95px}.testimonial-viewport{overflow:hidden;width:910px;margin:auto}.testimonial-track{display:flex;gap:16px;transition:transform .55s cubic-bezier(.65,0,.35,1)}.testimonial-card{flex:0 0 284px;height:394px;background:#fff;border:1.5px solid var(--yellow);border-radius:30px;padding:26px 28px 22px;text-align:center;display:flex;flex-direction:column;align-items:center}.testimonial-card .client-logo{width:170px;height:86px;object-fit:contain;margin-bottom:16px}.testimonial-card .quote{font-size:12px;line-height:1.65;font-style:italic;color:#666;margin:0 auto 18px}.testimonial-card .name{font-size:13px;font-weight:800;margin-top:auto}.testimonial-nav .navbtn{filter:grayscale(1);opacity:.55}.testimonial-nav .prev{left:85px}.testimonial-nav .next{right:85px}
.stories{position:relative;background:#fff;padding-top:0}.team-bg{height:520px;background:url('img/bg-equipe.png') center/cover}.story-panel{width:970px;margin:-185px auto 0;background:#fff;border-radius:36px 36px 0 0;padding:32px 55px 55px;position:relative}.story-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.story-card{height:320px;position:relative;overflow:hidden;border-radius:16px}.story-card img{width:100%;height:100%;object-fit:cover}.story-tag{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);background:#fff;border-radius:999px;padding:8px 14px;font-size:12px;font-weight:700}
.ecosystem{min-height:830px;background:linear-gradient(rgba(10,10,10,.55),rgba(10,10,10,.55)),url('img/bg-ecossistema.png') center/cover;color:#fff;text-align:center;padding:125px 70px 80px}.ecosystem .badge{width:182px;margin:0 auto 45px}.ecosystem .eyebrow{font-size:20px;font-weight:600;max-width:680px;margin:0 auto 45px}.ecosystem .copy{font-size:18px;line-height:1.55;max-width:980px;margin:auto}.eco-pills{display:grid;grid-template-columns:repeat(5,1fr);gap:22px;margin:45px auto 0;max-width:1070px}.eco-pill{height:73px;border:1px solid rgba(255,255,255,.65);border-radius:999px;display:grid;place-items:center;font-size:17px;font-weight:600}
.book{height:830px;position:relative;background:#fff;overflow:hidden}.book img{position:absolute;right:-40px;top:60px;width:875px;height:730px;object-fit:cover;border-radius:18px}.book-copy{position:absolute;left:215px;top:245px;width:390px}.book-copy .label{display:inline-block;background:var(--yellow);border-radius:999px;padding:10px 18px;font-weight:700;margin-bottom:18px}.book-copy h2{font-size:24px;line-height:1.25;margin:0 0 18px}.book-copy p{font-size:15px;line-height:1.9;margin:0 0 30px}
.contact{min-height:830px;background:linear-gradient(rgba(0,0,0,.58),rgba(0,0,0,.58)),url('img/bg-contato.png') center/cover;color:#fff;padding:80px 105px;display:grid;grid-template-columns:380px 535px;gap:85px;align-items:center}.contact h2{font-size:28px;line-height:1.28;margin:0 0 28px}.contact p{font-size:16px;line-height:1.6}.lead-form{background:rgba(0,0,0,.42);border-radius:20px;padding:28px}.lead-form input[type=text],.lead-form input[type=tel],.lead-form input[type=email],.lead-form textarea{width:100%;background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.75);color:#fff;padding:9px 0;margin-bottom:10px}.lead-form fieldset{border:0;padding:12px 0;margin:0}.lead-form legend{font-size:13px;font-weight:700;margin-bottom:8px}.lead-form label{display:block;font-size:11px;line-height:1.5;margin:4px 0}.lead-form textarea{height:70px}.lead-form .btn{width:100%;margin-top:14px}
.footer{height:140px;background:#111;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 105px;font-size:13px}.footer img{max-height:38px;max-width:170px}
.wa-float{position:fixed;right:24px;bottom:24px;width:58px;height:58px;border-radius:50%;background:#0aae35;display:grid;place-items:center;z-index:40;box-shadow:0 8px 30px rgba(0,0,0,.25)}.wa-float svg{width:31px;fill:#fff}
@media (max-width: 820px){.site{width:100%}.header{padding:0 20px}.hero{height:300px}.hero .slide img{height:300px}.hero-intro h1{font-size:31px;letter-spacing:2px}.hero-intro .lead{font-size:15px;padding:0 20px}.hero-wa{display:none}.container{max-width:calc(100% - 28px)}.stats{grid-template-columns:1fr 1fr}.value-row{grid-template-columns:1fr}.value-images{height:320px}.logo-section{height:250px}.why-grid,.solution-grid{grid-template-columns:1fr}.info-card,.solution-card{height:auto;min-height:160px}.vertical{height:auto;padding:55px 20px}.vertical .title,.v-copy,.v-img,.v2 .cta-row{position:static!important;width:100%!important;margin:0 0 24px}.v-img{height:auto!important}.case-slide{grid-template-columns:1fr;padding:0 15px}.case-gallery,.case-main,.case-thumbs{width:100%}.testimonial-viewport{width:284px}.story-grid{grid-template-columns:1fr 1fr}.eco-pills{grid-template-columns:1fr 1fr}.book{height:auto;padding:50px 20px}.book img,.book-copy{position:static;width:100%;height:auto}.contact{grid-template-columns:1fr;padding:55px 20px}.footer{padding:0 20px;flex-wrap:wrap}}


/* ===== v4 — correções críticas de imagens e carrosséis ===== */
.slider > .track{display:flex!important;width:100%!important;max-width:none!important;transform:translate3d(0,0,0);will-change:transform;}
.hero .slide,.panorama .pan-slide{position:relative!important;flex:0 0 100%!important;width:100%!important;min-width:100%!important;max-width:100%!important;overflow:hidden!important;}
.hero .slide{height:477px!important;}
.hero .slide > img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;max-width:none!important;}
.panorama,.panorama .track,.panorama .pan-slide{height:434px!important;}
.panorama .pan-slide > img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;object-position:center center!important;}
/* recortes exatos indicados pelo Figma para as imagens-base dos dois panoramas */
.panorama .pan-slide > img.figma-pan-prmn{height:818px!important;top:-231px!important;left:0!important;object-fit:fill!important;}
.panorama .pan-slide > img.figma-pan-zoo{height:547px!important;top:-92px!important;left:0!important;object-fit:fill!important;}
.panorama .navbtn{z-index:30!important;pointer-events:auto!important;}
.panorama:after{z-index:25!important;pointer-events:none!important;}

/* imagens da seção de verticais: evitar recortes contaminados pelas sobreposições dos prints */
.vertical img.v-img{object-fit:cover!important;object-position:center center!important;}
.v1 img.v-img:first-of-type{object-position:center top!important;}
.v1 img.v-img:nth-of-type(2){object-position:center bottom!important;}

/* carrossel de cases sempre trabalha em passos de uma prancheta de 1280 px */
.case-viewport{width:1280px!important;max-width:1280px!important;overflow:hidden!important;}
.case-track{display:flex!important;width:1280px!important;max-width:none!important;will-change:transform;}
.case-slide{flex:0 0 1280px!important;width:1280px!important;min-width:1280px!important;}

/* carrossel de logos: clipping real, sem permitir página vazia */
.logo-viewport{overflow:hidden!important;}
.logo-track{will-change:transform;}

/* impede artefatos de seleção azul provenientes dos screenshots usados como fonte */
.panorama .pan-slide{background:#fff!important;}




/* Pixel-accurate desktop reconstruction from the 121 supplied Figma nodes.
   The 1280px artboard is scaled as a unit below 1280px so the design remains visually faithful. */
:root{--yellow:#fed702;--soft:#f5f5f3;--ink:#111}
html,body{margin:0!important;padding:0!important;background:#e9e9e7!important}
html{overflow-x:hidden!important;width:100%!important}
body{overflow-x:hidden;min-width:0}
.site{
  width:1280px!important;max-width:none!important;height:9965px!important;margin:0!important;
  position:absolute!important;left:0;top:0;background:#fff!important;overflow:hidden!important;
  box-shadow:none!important;transform-origin:top left;
}
.site>header,.site>section,.site>footer{position:absolute!important;left:0!important;width:1280px!important;margin:0!important;box-sizing:border-box}
.container{width:1070px!important;max-width:none!important;margin:0 auto!important}

/* Header — Figma y:-397..-320 => page y:0..77 */
.header{top:0!important;height:77px!important;padding:0 104px!important;background:#111!important;z-index:20}
.header .brand{width:138px!important;height:36px!important;object-fit:contain}
.header-social{gap:16px!important}.header-social img{width:26px!important;height:30px!important;filter:none!important}

/* Hero banner */
.hero{top:96px!important;height:477px!important;overflow:hidden!important;background:#111}
.hero .track,.hero .slide{height:477px!important}
.hero .slide img{width:1280px!important;height:477px!important;object-fit:cover!important}
.hero .navbtn,.panorama .navbtn{width:29px!important;height:29px!important;padding:0!important;top:50%!important}
.hero .navbtn.prev,.panorama .navbtn.prev{left:104px!important}
.hero .navbtn.next,.panorama .navbtn.next{right:105px!important}

/* Intro */
.hero-intro{top:573px!important;height:259px!important;padding:0!important;background:#fff!important}
.hero-intro .container{position:relative;height:100%}
.hero-intro h1{
  position:absolute!important;left:118px!important;top:36px!important;width:834px!important;height:42px!important;
  margin:0!important;font-size:40px!important;line-height:42px!important;letter-spacing:4px!important;text-align:left!important;font-weight:400!important
}
.hero-intro .lead{
  position:absolute!important;left:107px!important;top:94px!important;width:856px!important;height:29px!important;
  margin:0!important;font-size:17px!important;line-height:29px!important;text-align:left!important
}
.hero-wa{right:105px!important;top:36px!important;width:64px!important;height:64px!important;border-radius:18px!important}
.pills{
  position:absolute!important;left:0!important;top:170px!important;width:1070px!important;height:43px!important;
  display:grid!important;grid-template-columns:194px 165px 165px 165px 314px!important;gap:17px!important;justify-content:start!important
}
.pill{height:43px!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:center!important;border-radius:100px!important;font-size:15px!important;line-height:30px!important;letter-spacing:1.5px!important}

/* KPI + strategy */
.value{top:832px!important;height:537px!important;padding:32px 0 0!important;background:var(--soft)!important;border-top:1px solid #dededb!important}
.value>.container{height:100%;position:relative}
.stats{position:absolute!important;left:0!important;top:0!important;width:1070px!important;height:111px!important;grid-template-columns:261px 261px 261px 261px!important;gap:10px!important}
.stat{height:111px!important;border-radius:20px!important;background:rgba(255,255,255,.72)!important;border:1px solid var(--yellow)!important}
.card:before{width:93px!important;height:12px!important;top:-6px!important}
.stat strong{font-size:36px!important;line-height:30px!important}
.stat span{font-size:14px!important;line-height:16px!important;margin-top:7px!important}
.value-row{position:absolute!important;left:0!important;top:143px!important;width:1070px!important;height:362px!important;display:block!important;margin:0!important}
.value-copy{position:absolute!important;left:0!important;top:70px!important;width:435px!important}
.value-copy h2{width:435px!important;height:73px!important;margin:0 0 6px!important;font-size:22px!important;line-height:24px!important}
.value-copy p{width:402px!important;height:95px!important;margin:0!important;font-size:14.5px!important;line-height:25px!important}
.value-copy .cta-row{justify-content:flex-start!important;margin-top:17px!important}
.value-images{position:absolute!important;left:469px!important;top:0!important;width:601px!important;height:319px!important}
.value-images .back{left:0!important;top:0!important;width:506px!important;height:285px!important;border-radius:20px!important}
.value-images .front{left:250px!important;top:65px!important;width:350px!important;height:251px!important;border-radius:20px!important}
.btn{height:54px!important;padding:0 12px 0 20px!important;border:6px solid #e1e0de!important;border-radius:100px!important;background:var(--yellow)!important;font-size:15px!important;line-height:30px!important;letter-spacing:1.5px!important}
.btn .circle{width:24px!important;height:24px!important;font-size:15px!important}

/* Client logo carousel */
.logo-section{top:1369px!important;height:232px!important;background:#fff!important}
.logo-viewport{width:1070px!important;height:226px!important;overflow:hidden!important}
.logo-track{height:226px!important;grid-template-rows:113px 113px!important;grid-auto-columns:112px!important;column-gap:7px!important}
.logo-cell{padding:10px!important}.logo-cell img{max-width:104px!important;max-height:66px!important}
.logo-arrow{width:29px!important;height:29px!important;padding:0!important}
.logo-arrow.prev{left:80px!important}.logo-arrow.next{right:80px!important}

/* Panoramic carousel 1 */
.panorama{height:434px!important;padding:0!important;background:#fff!important;overflow:hidden!important}
.panorama:nth-of-type(5){top:1663px!important}
.panorama .track,.panorama .pan-slide{height:434px!important}
.panorama .pan-slide img{width:1280px!important;height:434px!important;object-fit:cover!important}
.panorama:after{width:72px!important;height:29px!important}

/* Why GDesign */
.why{top:2097px!important;height:401px!important;padding:0!important;background:var(--soft)!important}
.why .container{position:relative;height:100%}
.why .section-title{position:absolute!important;left:127px!important;top:6px!important;width:815px!important;height:28px!important;margin:0!important;font-size:20px!important;line-height:28px!important}
.why-grid{position:absolute!important;left:0!important;top:58px!important;width:1070px!important;height:198px!important;grid-template-columns:348px 349px 348px!important;gap:12px!important}
.info-card{height:198px!important;padding:23px 21px!important;border-radius:20px!important;background:rgba(255,255,255,.7)!important}
.info-card h3{font-size:16px!important;line-height:20px!important;margin:0 0 19px!important}
.info-card p{font-size:16px!important;line-height:24px!important}
.why .cta-row{position:absolute!important;left:0!important;top:296px!important;width:1070px!important;margin:0!important}

/* Panoramic carousel 2 */
.panorama:nth-of-type(7){top:2498px!important}

/* Solutions */
.solutions{top:2932px!important;height:392px!important;padding:0!important;background:var(--soft)!important}
.solutions .container{position:relative;height:100%}
.solutions .section-title{position:absolute!important;left:0!important;top:5px!important;width:1070px!important;height:29px!important;margin:0!important;font-size:20px!important;line-height:29px!important}
.solution-grid{position:absolute!important;left:0!important;top:54px!important;width:1070px!important;height:214px!important;grid-template-columns:261px 261px 261px 261px!important;gap:9px!important}
.solution-card{height:214px!important;padding:22px 30px!important;border-radius:20px!important}
.solution-card h3{font-size:20px!important;line-height:22px!important;margin:0 0 16px!important}
.solution-card p{font-size:16px!important;line-height:22px!important}
.solutions .cta-row{position:absolute!important;left:0!important;top:301px!important;width:1070px!important;margin:0!important}

/* Verticals */
.vertical{padding:0!important}
.v1{top:3324px!important;height:832px!important;background:#fff!important}
.v2{top:4156px!important;height:832px!important;background:#f8f8f7!important}
.vertical .title{left:105px!important;top:101px!important;width:356px!important;height:70px!important;font-size:22px!important;line-height:25px!important}
.v-copy{width:401px!important}
.v-copy h3{font-size:18px!important;line-height:24px!important;margin:0 0 30px!important}
.v-copy p{font-size:15px!important;line-height:26px!important}
.v-img{border-radius:16px!important}
.v1 .c1{left:105px!important;top:230px!important}
.v1 .img1{left:554px!important;top:208px!important;width:620px!important;height:317px!important}
.v1 .img2{left:105px!important;top:429px!important;width:620px!important;height:317px!important}
.v1 .c2{left:771px!important;top:565px!important;width:392px!important}
.v2 .c1{left:105px!important;top:127px!important;width:401px!important}
.v2 .img1{left:554px!important;top:98px!important;width:620px!important;height:317px!important}
.v2 .img2{left:105px!important;top:319px!important;width:620px!important;height:317px!important}
.v2 .c2{left:771px!important;top:455px!important;width:357px!important}
.v2 .cta-row{left:0!important;right:0!important;top:694px!important;bottom:auto!important;width:1280px!important;margin:0!important}

/* Cases */
.cases{top:4983px!important;height:832px!important;padding:0!important;background:#fff!important;overflow:hidden!important}
.cases>.container{height:100%;position:relative}
.cases .section-title{position:absolute!important;left:235px!important;top:66px!important;width:564px!important;height:76px!important;margin:0!important;font-size:20px!important;line-height:25px!important}
.case-viewport{position:absolute!important;left:-105px!important;top:181px!important;width:1280px!important;height:493px!important;overflow:hidden!important}
.case-track{height:493px!important}
.case-slide{position:relative!important;flex:0 0 1280px!important;width:1280px!important;height:493px!important;display:block!important;padding:0!important;min-height:0!important}
.case-copy{position:absolute!important;left:173px!important;top:0!important;width:320px!important;padding:0!important}
.case-logo{width:150px!important;height:72px!important;margin:0!important;object-position:left center!important}
.case-copy p{position:absolute!important;left:0!important;top:107px!important;width:320px!important;height:auto!important;margin:0!important;font-size:15px!important;line-height:22px!important}
.case-gallery{position:static!important;padding:0!important}
.case-main{position:absolute!important;left:530px!important;top:1px!important;width:567px!important;height:306px!important;border-radius:16px!important}
.case-thumbs{display:contents!important}
.case-thumbs img{position:absolute!important;top:318px!important;height:171px!important;border-radius:14px!important;object-fit:cover!important}
.case-thumbs img:nth-child(1){left:173px!important;width:348px!important}
.case-thumbs img:nth-child(2){left:530px!important;width:182px!important}
.case-thumbs img:nth-child(3){left:723px!important;width:181px!important}
.case-thumbs img:nth-child(4){left:916px!important;width:181px!important}
.case-nav .navbtn{top:391px!important;width:29px!important;height:29px!important;padding:0!important}
.case-nav .prev{left:84px!important}.case-nav .next{right:84px!important}
.cases .cta-row{position:absolute!important;left:0!important;top:709px!important;width:1070px!important;margin:0!important}

/* Testimonials */
.testimonials{top:5815px!important;height:832px!important;padding:0!important;background:var(--soft)!important;overflow:hidden!important}
.testimonials .container{position:relative;height:100%}
.testimonials .section-title{position:absolute!important;left:235px!important;top:143px!important;width:564px!important;height:36px!important;margin:0!important;font-size:20px!important;line-height:36px!important}
.testimonial-viewport{position:absolute!important;left:198px!important;top:260px!important;width:884px!important;height:394px!important;margin:0!important;overflow:hidden!important}
.testimonial-track{gap:16px!important}
.testimonial-card{flex:0 0 284px!important;width:284px!important;height:394px!important;border-radius:26px!important;padding:27px 24px 22px!important}
.testimonial-card .client-logo{width:188px!important;height:90px!important;margin:0 auto 12px!important}
.testimonial-card .quote{font-size:12px!important;line-height:18px!important;margin:0 auto 14px!important;color:#666!important}
.testimonial-card .name{font-size:12px!important;line-height:18px!important}
.testimonial-nav .navbtn{top:448px!important;width:29px!important;height:29px!important;padding:0!important}
.testimonial-nav .prev{left:81px!important}.testimonial-nav .next{right:81px!important}

/* Content / reels */
.stories{top:6640px!important;height:830px!important;padding:0!important;background:transparent!important;overflow:visible!important}
.team-bg{position:absolute!important;left:0!important;top:0!important;width:1280px!important;height:518px!important}
.story-panel{position:absolute!important;left:149px!important;top:331px!important;width:967px!important;height:470px!important;margin:0!important;padding:0!important;border-radius:30px 30px 0 0!important;background:#fff!important;overflow:hidden!important}
.story-panel .section-title{position:absolute!important;left:74px!important;top:27px!important;width:834px!important;height:36px!important;margin:0!important;font-size:20px!important;line-height:36px!important}
.story-grid{position:absolute!important;left:31px!important;top:80px!important;width:auto!important;height:368px!important;display:flex!important;gap:17px!important;overflow:hidden!important}
.story-card{flex:0 0 215px!important;width:215px!important;height:368px!important;border-radius:0!important;overflow:visible!important}
.story-card img{width:215px!important;height:320px!important;object-fit:cover!important;border-radius:20px!important}
.story-tag{left:50%!important;bottom:0!important;transform:translateX(-50%)!important;width:136px!important;height:29px!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:center!important;border-radius:100px!important;background:var(--yellow)!important;color:#000!important;font-size:15px!important;line-height:29px!important;text-transform:uppercase!important;letter-spacing:1.5px!important}

/* Ecosystem */
.ecosystem{top:7470px!important;height:832px!important;min-height:0!important;padding:0!important;background:linear-gradient(rgba(10,10,10,.55),rgba(10,10,10,.55)),url('img/bg-ecossistema.png') center/cover!important}
.ecosystem .badge{position:absolute!important;left:548px!important;top:131px!important;width:182px!important;height:101px!important;margin:0!important}
.ecosystem .eyebrow{position:absolute!important;left:301px!important;top:282px!important;width:677px!important;height:59px!important;margin:0!important;font-size:15px!important;line-height:22px!important}
.ecosystem .copy{position:absolute!important;left:151px!important;top:386px!important;width:978px!important;height:127px!important;margin:0!important;font-size:19px!important;line-height:30px!important}
.eco-pills{position:absolute!important;left:105px!important;top:544px!important;width:1069px!important;height:73px!important;margin:0!important;display:grid!important;grid-template-columns:195.8px 196.8px 195.8px 196.8px 195.8px!important;gap:22px!important}
.eco-pill{height:73px!important;border-radius:16px!important;text-transform:uppercase!important;font-size:16px!important;font-weight:700!important}
.eco-logos{position:absolute!important;left:283px!important;top:710px!important;width:713px!important;height:36px!important;display:flex!important;justify-content:space-between!important;align-items:center!important}
.eco-logos img:nth-child(1){width:183px!important;height:29px!important}
.eco-logos img:nth-child(2){width:208px!important;height:27px!important}
.eco-logos img:nth-child(3){width:138px!important;height:36px!important}

/* Book */
.book{top:8302px!important;height:832px!important;padding:0!important;background:#fff!important}
.book>img{position:absolute!important;left:447px!important;right:auto!important;top:61px!important;width:873px!important;height:728px!important;border-radius:18px!important}
.book-copy{position:absolute!important;left:215px!important;top:245px!important;width:427px!important}
.book-copy .label{display:block!important;width:361px!important;height:73px!important;background:var(--yellow)!important;border-radius:100px!important;padding:8px 18px!important;font-size:13px!important;line-height:18px!important;font-weight:700!important;text-transform:none!important}
.book-copy h2{font-size:18px!important;line-height:25px!important;margin:18px 0 8px!important;width:361px!important}
.book-copy p{font-size:14.5px!important;line-height:23px!important;width:361px!important;margin:0!important}
.book-copy .btn{position:absolute!important;left:1px!important;top:338px!important;width:426px!important}

/* Contact */
.contact{top:9134px!important;height:691px!important;min-height:0!important;padding:0!important;display:block!important;background:linear-gradient(rgba(0,0,0,.55),rgba(0,0,0,.55)),url('img/bg-contato.png') center/cover!important}
.contact>div:first-child{position:absolute!important;left:105px!important;top:158px!important;width:342px!important}
.contact h2{width:342px!important;height:90px!important;margin:0!important;font-size:24px!important;line-height:30px!important}
.contact p{width:340px!important;margin:23px 0 0!important;font-size:15px!important;line-height:25px!important}
.lead-form{position:absolute!important;left:570px!important;top:40px!important;width:535px!important;height:624px!important;padding:20px 26px 23px!important;border-radius:20px!important;background:rgba(0,0,0,.41)!important}
.lead-form input[type=text],.lead-form input[type=tel],.lead-form input[type=email]{height:21px!important;min-height:21px!important;border-radius:5px!important;padding:2px 8px!important;font-size:12px!important}
.lead-form textarea{height:62px!important;min-height:62px!important;border-radius:5px!important;padding:8px!important;font-size:12px!important}
.lead-form fieldset{margin:8px 0 5px!important;padding:0!important;border:0!important}
.lead-form legend,.lead-form label,.form-fine{font-size:12px!important;line-height:20px!important}
.lead-form .btn{position:absolute!important;left:26px!important;bottom:23px!important;width:483px!important}

/* Footer */
.footer{top:9825px!important;height:140px!important;padding:0 105px!important;background:#111!important;color:#fff!important;font-size:12px!important}
.footer img{max-width:none!important;max-height:none!important}
.footer img:nth-of-type(1){width:103px!important;height:32px!important}
.footer img:nth-of-type(2){width:164px!important;height:22px!important}

/* Floating WhatsApp — retain interaction without shifting Figma layout */
.wa-float{position:fixed!important;right:24px!important;bottom:24px!important;z-index:1000!important}

/* Disable old mobile reflow rules: scale the complete artboard instead. */
@media (max-width: 820px){
  .header,.hero,.hero-intro,.value,.logo-section,.panorama,.why,.solutions,.vertical,.cases,.testimonials,.stories,.ecosystem,.book,.contact,.footer{width:1280px!important}
  .hero-wa{display:grid!important}
  .why-grid{display:grid!important}.solution-grid{display:grid!important}
  .vertical .title,.v-copy,.v-img,.v2 .cta-row{position:absolute!important;margin:0!important}
  .case-slide{display:block!important}.testimonial-viewport{width:884px!important}
  .story-grid{display:flex!important}.eco-pills{display:grid!important}
  .book img,.book-copy{position:absolute!important;width:auto}
  .contact{display:block!important}.footer{flex-wrap:nowrap!important}
}



.header{height:96px!important;padding:0!important;background:#fff!important;display:block!important}
.header-brand{position:absolute;left:104px;top:23px;width:138px;height:36px;display:block}
.header-brand img{width:138px;height:36px;object-fit:contain;filter:none!important}
.header-social{position:static!important;display:block!important}
.header-social a{position:absolute;display:block}
.header-social a:nth-child(1){left:1072px;top:22px;width:23px;height:23px}
.header-social a:nth-child(2){left:1110px;top:28px;width:26px;height:23px}
.header-social a:nth-child(3){left:1152px;top:25px;width:23px;height:23px}
.header-social img{width:100%!important;height:100%!important;object-fit:contain!important;filter:none!important}

.logo-section{height:232px!important;display:block!important;position:absolute!important;background:#fff!important}
.logo-viewport{position:absolute;left:0;top:0;width:1280px!important;height:232px!important;overflow:hidden!important;margin:0!important}
.logo-track{height:232px!important;width:2560px!important;display:flex!important;grid-template:none!important;gap:0!important;transition:transform .55s cubic-bezier(.65,0,.35,1)!important}
.logo-page{flex:0 0 1280px;width:1280px;height:232px;display:grid;align-content:center;justify-content:center;grid-template-columns:repeat(8,113px);grid-template-rows:repeat(2,113px);column-gap:7px;row-gap:0}
.logo-page.page-secondary{grid-template-columns:repeat(5,113px)}
.logo-cell{width:113px;height:113px;padding:0!important;display:grid!important;place-items:center!important}
.logo-cell img{width:113px!important;height:113px!important;max-width:none!important;max-height:none!important;object-fit:contain!important}
.logo-arrow{z-index:4!important;top:101px!important;width:17px!important;height:29px!important;padding:0!important}
.logo-arrow.prev{left:84px!important}.logo-arrow.next{right:84px!important}
.logo-arrow img{width:17px!important;height:29px!important}.logo-arrow.next img{transform:rotate(180deg)!important}

.case-viewport{left:0!important}
.case-logo{height:72px!important;object-fit:contain!important;object-position:left center!important;width:150px!important}

.team-bg{background-image:url('img/bg-equipe.png')!important;background-repeat:no-repeat!important;background-size:122.05% 89.77%!important;background-position:-6.96% 0!important;background-color:#fff!important}
.story-panel{overflow:visible!important}
.story-viewport{position:absolute;left:31px;top:80px;width:895px;height:368px;overflow:hidden}
.story-grid{position:static!important;left:auto!important;top:auto!important;width:max-content!important;height:368px!important;display:flex!important;gap:17px!important;overflow:visible!important;transition:transform .55s cubic-bezier(.65,0,.35,1)!important}
.story-card{flex:0 0 215px!important;width:215px!important;height:368px!important}
.story-card img{width:215px!important;height:320px!important;border-radius:20px!important;object-fit:cover!important}
.story-tag{bottom:0!important;width:136px!important;height:29px!important;background:#fed702!important;color:#000!important;font-size:15px!important;font-weight:700!important;letter-spacing:1.5px!important}
.story-nav{position:absolute;left:0;top:491px;width:1280px;height:29px;pointer-events:none;z-index:5}
.story-arrow{position:absolute;top:0;width:17px;height:29px;border:0;background:transparent;padding:0;pointer-events:auto;cursor:pointer}
.story-arrow.prev{left:84px}.story-arrow.next{right:84px}
.story-arrow img{width:17px;height:29px}.story-arrow.next img{transform:rotate(180deg)}

.ecosystem{background:none!important;isolation:isolate}
.ecosystem:before{content:"";position:absolute;z-index:-2;left:-.13px;top:0;width:1280.4px;height:855px;background:url('img/bg-ecossistema.png') left top/100% 100% no-repeat}
.ecosystem:after{content:"";position:absolute;z-index:-1;inset:0;background:rgba(0,0,0,.80)}
.ecosystem .badge{content:url('img/badge-ecossistema-goakira.png')}

.contact{background:none!important;isolation:isolate;overflow:hidden!important}
.contact:before{content:"";position:absolute;z-index:-2;left:-109.8px;top:0;width:1499.5px;height:843.5px;background:url('img/bg-contato.png') center/100% 100% no-repeat}
.contact:after{content:"";position:absolute;z-index:-1;inset:0;background:rgba(0,0,0,.77)}
.lead-form{padding:0!important;border:0!important;color:#fff!important}
.lead-form>input{position:absolute!important;left:26px!important;width:483px!important;height:21px!important;min-height:21px!important;background:#fff!important;border:1px solid #d9d9d9!important;border-radius:5px!important;color:#444!important;padding:2px 8px!important;margin:0!important;font-size:12px!important;line-height:17px!important}
.lead-form .field-name{top:20px!important}.lead-form .field-phone{top:47px!important}.lead-form .field-email{top:74px!important}
.lead-form fieldset{position:absolute!important;left:26px!important;width:483px!important;margin:0!important;padding:0!important;border:0!important;color:#fff!important}
.lead-form .invest-fieldset{top:108px!important;height:104px!important}
.lead-form .segment-fieldset{top:241px!important;height:101px!important}
.lead-form legend{font-size:12px!important;line-height:18px!important;font-weight:500!important;margin:0 0 3px!important;color:#fff!important}
.lead-form fieldset label{display:block!important;font-size:12px!important;line-height:20px!important;margin:0!important;color:#fff!important}
.lead-form input[type=radio],.lead-form input[type=checkbox]{accent-color:#fff}
.lead-form .project-field{position:absolute!important;left:26px!important;top:348px!important;width:483px!important;height:62px!important;min-height:62px!important;background:#fff!important;border:1px solid #d9d9d9!important;border-radius:5px!important;color:#444!important;padding:8px!important;margin:0!important;font-size:12px!important;resize:none!important}
.consent-block{position:absolute;left:26px;top:432px;width:483px;height:92px;color:#fff}
.consent-line{display:flex!important;align-items:flex-start;gap:4px;font-size:12px!important;line-height:14px!important;margin:0!important;color:#fff!important}
.consent-line input{flex:0 0 auto;margin-top:1px}
.form-fine{font-size:12px!important;line-height:14px!important;color:#fff!important;margin:13px 0 0!important;width:483px!important}
.lead-form .form-submit{position:absolute!important;left:26px!important;top:547px!important;bottom:auto!important;width:483px!important;height:54px!important;margin:0!important;padding:0 12px 0 18px!important;font-size:15px!important;letter-spacing:1.5px!important}

.footer{position:absolute!important;display:block!important;padding:0!important;background:none!important;isolation:isolate;overflow:hidden!important}
.footer:before{content:"";position:absolute;z-index:-2;left:-109.8px;top:-692px;width:1499.5px;height:843.5px;background:url('img/bg-contato.png') center/100% 100% no-repeat}
.footer:after{content:"";position:absolute;z-index:-1;inset:0;background:rgba(0,0,0,.73)}
.footer-follow{position:absolute;left:105px;top:51px;width:230px;height:39px;margin:0;color:#fff;font-size:12px;line-height:16px;font-weight:400}
.footer-social{position:absolute;left:383px;top:54px;width:103px;height:32px;display:flex;align-items:center;justify-content:space-between}
.footer-social a{display:grid;place-items:center}
.footer-social img{width:23px!important;height:23px!important;object-fit:contain!important}
.footer-social a:nth-child(2) img{width:26px!important;height:23px!important}
.footer-gdesign{position:absolute;left:582px;top:55px;width:116px!important;height:30px!important;object-fit:contain}
.footer-group{position:absolute;left:861px;top:54px;width:313px;height:31px;color:#fff;display:flex;align-items:center;justify-content:space-between}
.footer-group p{width:145px;height:30px;margin:0;font-size:12px;line-height:15px}
.footer-group strong{font-weight:800}
.footer-group img{width:145px!important;height:29px!important;object-fit:contain}



/* =========================================================
   V6 — alinhamentos confirmados pelos nós do Figma
   ========================================================= */

/* HEADER
   Rectangle 13:192 = 1280x77
   Logo 13:204 = x104 / y23 / 138x35.864
   Redes = x1072,1110,1152 com glyphs alinhados em y≈31
*/
.header{
  height:77px!important;
  padding:0!important;
  background:#fff!important;
  overflow:visible!important;
}
.header-brand{
  left:104px!important;
  top:23px!important;
  width:138px!important;
  height:36px!important;
}
.header-brand img{
  width:138px!important;
  height:36px!important;
  display:block!important;
  opacity:1!important;
  visibility:visible!important;
}

.header-social{position:static!important}
.header-social a{
  position:absolute!important;
  display:block!important;
  overflow:visible!important;
  z-index:25!important;
  opacity:1!important;
  visibility:visible!important;
}

/* Ícones sociais do cabeçalho (Instagram/LinkedIn/WhatsApp).
   V10.13 — as regras antigas abaixo (extraídas 1:1 do Figma por ícone)
   tinham maior especificidade que qualquer ajuste feito depois no arquivo,
   então o LinkedIn continuava preso a uma borda própria + glyph de 15px
   enquanto Instagram/WhatsApp vazavam do contêiner com 23px de altura —
   causa raiz do desalinhamento. Posição/tamanho do link (.social-ig/
   .social-in/.social-wa) seguem sendo definidos pelas camadas mais abaixo;
   aqui só garantimos que a imagem preencha o link, sem borda extra. */
.header-social .social-in{
  border:0!important;
  border-radius:0!important;
  background:none!important;
}
.header-social .social-ig img,
.header-social .social-in img,
.header-social .social-wa img{
  position:static!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  display:block!important;
  opacity:1!important;
  visibility:visible!important;
  filter:none!important;
}

/* CASES / EXEMPLOS DE MARCAS
   O .container mede 1070px e já começa em x=105.
   O viewport no Figma precisa começar em x global 0,
   logo left=-105 relativo ao container. A V5 havia zerado isso
   e deslocado toda a galeria 105px para a direita.
*/
.case-viewport{
  left:-105px!important;
}
.case-logo{
  object-position:left center!important;
}

/* IMAGEM DE FUNDO DO FORM + FOOTER
   Nó 25:3577: 1280x831. O fill original ocupa 117.15% x 101.5%,
   com left=-8.58% e top=-1.5%.
   A seção contact começa exatamente no topo desse nó; footer
   inicia 692px abaixo, portanto ambos compartilham o mesmo crop.
*/
.contact:before{
  left:-109.824px!important;
  top:-12.465px!important;
  width:1499.52px!important;
  height:843.465px!important;
  background-image:url('img/bg-contato.png')!important;
  background-size:1499.52px 843.465px!important;
  background-repeat:no-repeat!important;
  background-position:0 0!important;
}
.footer:before{
  left:-109.824px!important;
  top:-704.465px!important;
  width:1499.52px!important;
  height:843.465px!important;
  background-image:url('img/bg-contato.png')!important;
  background-size:1499.52px 843.465px!important;
  background-repeat:no-repeat!important;
  background-position:0 0!important;
}

/* FOOTER
   25:3580 = 1280x140
   25:3506 x105 y+51 / 230x39 / Montserrat 14 uppercase
   25:3529 x383 y+54 / 102.858x32
   25:3530 x582 y+55 / 116x30.147
   25:3569 x861 y+54 / 313x31.075
*/
.footer{
  height:140px!important;
  padding:0!important;
  display:block!important;
  overflow:hidden!important;
  color:#fff!important;
}
.footer:after{
  background:rgba(0,0,0,.73)!important;
}
.footer-follow{
  position:absolute!important;
  left:105px!important;
  top:51px!important;
  width:230px!important;
  height:39px!important;
  margin:0!important;
  font-size:14px!important;
  line-height:20px!important;
  font-weight:400!important;
  text-transform:uppercase!important;
  color:#fff!important;
}

/* container das redes mantém exatamente o bounding box do Group 110 */
.footer-social{
  position:absolute!important;
  left:383px!important;
  top:54px!important;
  width:103px!important;
  height:32px!important;
  display:block!important;
}
.footer-social a{
  position:absolute!important;
  display:block!important;
  opacity:1!important;
  visibility:visible!important;
}
.footer-social .social-ig{
  left:0!important;
  top:0!important;
  width:23px!important;
  height:32px!important;
}
.footer-social .social-ig img{
  position:absolute!important;
  left:0!important;
  top:9px!important;
  width:23px!important;
  height:23px!important;
  object-fit:contain!important;
  display:block!important;
}
.footer-social .social-in{
  left:38px!important;
  top:9px!important;
  width:26px!important;
  height:23px!important;
  border:2px solid #fff!important;
  border-radius:6px!important;
  display:grid!important;
  place-items:center!important;
}
.footer-social .social-in img{
  position:static!important;
  width:15px!important;
  height:15px!important;
  object-fit:contain!important;
  display:block!important;
}
.footer-social .social-wa{
  left:80px!important;
  top:9px!important;
  width:23px!important;
  height:23px!important;
}
.footer-social .social-wa img{
  width:23px!important;
  height:23px!important;
  object-fit:contain!important;
  display:block!important;
}

.footer-gdesign{
  position:absolute!important;
  left:582px!important;
  top:55px!important;
  width:116px!important;
  height:30.147px!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
}
.footer-group{
  position:absolute!important;
  left:861px!important;
  top:54px!important;
  width:313px!important;
  height:31.075px!important;
  display:block!important;
}
.footer-group p{
  position:absolute!important;
  left:0!important;
  top:0!important;
  width:145px!important;
  height:30px!important;
  margin:0!important;
  font-size:12px!important;
  line-height:15px!important;
  color:#fff!important;
}
.footer-group img{
  position:absolute!important;
  left:168px!important;
  top:2px!important;
  width:145px!important;
  height:29.075px!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
}

/* evita regras genéricas antigas de footer img sobrescreverem os logos */
.footer img{max-width:none!important;max-height:none!important}



/* ============================================================
   V8 — correções pontuais, preservando a estrutura aprovada V6
   Fonte de verdade: novo arquivo Figma LPS-GDESIGN
   ============================================================ */

/* ---------- HEADER: 1280 x 77 / assets reais ---------- */
.header{
  height:77px!important;
  background:#fff!important;
  overflow:visible!important;
}
.header-brand{
  left:104px!important;
  top:23px!important;
  width:138px!important;
  height:36px!important;
}
.header-brand img{
  display:block!important;
  width:138px!important;
  height:36px!important;
  object-fit:contain!important;
  opacity:1!important;
  visibility:visible!important;
  filter:none!important;
}
.header-social a{
  position:absolute!important;
  display:block!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  overflow:visible!important;
}
.header-social .social-ig{
  left:1072px!important;
  top:31px!important;
  width:23px!important;
  height:23px!important;
}
.header-social .social-in{
  left:1110px!important;
  top:31px!important;
  width:26px!important;
  height:23px!important;
}
.header-social .social-wa{
  left:1152px!important;
  top:31px!important;
  width:23px!important;
  height:23px!important;
}
.header-social img{
  position:static!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  opacity:1!important;
  visibility:visible!important;
  filter:none!important;
  border:0!important;
}

/* ---------- CARROSSEL DE CLIENTES ---------- */
.logo-section{
  height:232px!important;
  background:#fff!important;
  overflow:hidden!important;
}
.logo-viewport{
  position:absolute!important;
  left:0!important;
  top:0!important;
  width:1280px!important;
  height:232px!important;
  overflow:hidden!important;
  margin:0!important;
}
.logo-track{
  display:flex!important;
  width:2560px!important;
  height:232px!important;
  gap:0!important;
  transition:transform .55s cubic-bezier(.65,0,.35,1)!important;
  will-change:transform;
}
.logo-page{
  flex:0 0 1280px!important;
  width:1280px!important;
  height:232px!important;
  display:grid!important;
  align-content:center!important;
  justify-content:center!important;
  grid-template-rows:repeat(2,113px)!important;
  row-gap:0!important;
}
.logo-page.page-primary{
  grid-template-columns:repeat(8,113px)!important;
  column-gap:7px!important;
}
.logo-page.page-secondary{
  grid-template-columns:repeat(5,113px)!important;
  column-gap:7px!important;
}
.logo-cell{
  width:113px!important;
  height:113px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  background:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
.logo-cell::before,
.logo-cell::after{
  content:none!important;
  display:none!important;
}
.logo-cell img{
  display:block!important;
  width:117px!important;
  height:117px!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  transform:scale(1.035)!important;
  transform-origin:center!important;
  background:#fff!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
.logo-arrow{
  top:101px!important;
  width:17px!important;
  height:29px!important;
  z-index:5!important;
}
.logo-arrow.prev{left:84px!important}
.logo-arrow.next{right:84px!important}
.logo-arrow img{width:17px!important;height:29px!important}

/* ---------- SOLUÇÕES COMPLETAS ---------- */
.solution-grid{
  width:1069px!important;
  grid-template-columns:repeat(4,261px)!important;
  gap:10px!important;
  align-items:stretch!important;
}
.solution-card{
  box-sizing:border-box!important;
  width:261px!important;
  height:214px!important;
  min-height:214px!important;
  background:#fff!important;
  border:1px solid #fed702!important;
  border-radius:20px!important;
  text-align:center!important;
  overflow:hidden!important;
  display:block!important;
  padding:30px 24px 20px!important;
}
.solution-card h3{
  margin:0 0 16px!important;
  padding:0!important;
  width:100%!important;
  font-size:20px!important;
  line-height:22px!important;
  font-weight:500!important;
  text-transform:uppercase!important;
  text-align:center!important;
  word-break:normal!important;
}
.solution-card p{
  margin:0!important;
  padding:0!important;
  width:100%!important;
  font-size:16px!important;
  line-height:22px!important;
  font-weight:500!important;
  text-align:center!important;
  word-break:normal!important;
}

/* ---------- ATUAMOS ONDE... / imagens em alta resolução ---------- */
.v-image-frame{
  position:absolute!important;
  overflow:hidden!important;
  border-radius:16px!important;
  background:#f4f4f4!important;
}
.v-image-frame>img{
  max-width:none!important;
  object-fit:fill!important;
  border:0!important;
  filter:none!important;
  image-rendering:auto!important;
  transform:none!important;
}
.v1 .img1{left:554px!important;top:200px!important;width:620px!important;height:317px!important}
.v1 .img2{left:105px!important;top:423px!important;width:620px!important;height:317px!important}
.v2 .img1{left:554px!important;top:98px!important;width:620px!important;height:317px!important}
.v2 .img2{left:105px!important;top:319px!important;width:620px!important;height:317px!important}

/* ---------- CASES / projetos: coordenadas centradas na prancheta ---------- */
.case-viewport{
  left:0!important;
  width:1280px!important;
}
.case-slide{
  flex:0 0 1280px!important;
  width:1280px!important;
}
.case-copy{left:173px!important}
.case-main{left:530px!important}
.case-thumbs img:nth-child(1){left:173px!important}
.case-thumbs img:nth-child(2){left:530px!important}
.case-thumbs img:nth-child(3){left:723px!important}
.case-thumbs img:nth-child(4){left:916px!important}
.cases .cta-row{
  left:0!important;
  width:1280px!important;
  justify-content:center!important;
}

/* ---------- CONTEÚDOS / REELS ---------- */
.story-panel{
  overflow:hidden!important;
}
.story-viewport{
  position:absolute!important;
  left:31px!important;
  top:80px!important;
  width:895px!important;
  height:368px!important;
  overflow:hidden!important;
}
.story-grid{
  position:static!important;
  display:flex!important;
  width:max-content!important;
  height:368px!important;
  gap:17px!important;
  overflow:visible!important;
  transition:transform .55s cubic-bezier(.65,0,.35,1)!important;
  will-change:transform;
}
.story-card{
  position:relative!important;
  flex:0 0 215px!important;
  width:215px!important;
  height:368px!important;
  overflow:visible!important;
  border-radius:0!important;
  text-decoration:none!important;
  background:transparent!important;
}
.story-card>img,
.story-crop-source{
  position:absolute!important;
  left:0!important;
  top:0!important;
  width:215px!important;
  height:320px!important;
  overflow:hidden!important;
  border-radius:20px!important;
  display:block!important;
}
.story-card>img{
  object-fit:cover!important;
  filter:none!important;
}
.story-crop-source img{
  position:absolute!important;
  width:803px!important;
  height:451px!important;
  max-width:none!important;
  left:-68px!important;
  top:-53px!important;
  object-fit:fill!important;
  display:block!important;
}
.story-tag{
  position:absolute!important;
  left:50%!important;
  bottom:0!important;
  transform:translateX(-50%)!important;
  width:136px!important;
  height:29px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  border-radius:100px!important;
  background:#fed702!important;
  color:#000!important;
  font-size:15px!important;
  line-height:29px!important;
  font-weight:700!important;
  letter-spacing:1.5px!important;
  text-transform:uppercase!important;
}
.story-card:hover .story-tag,
.story-card:focus-visible .story-tag{
  transform:translateX(-50%) scale(1.035)!important;
}

/* ---------- ECOSSISTEMA GOAKIRA ---------- */
.ecosystem{
  background:none!important;
  isolation:isolate!important;
  overflow:hidden!important;
}
.ecosystem::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:-2!important;
  left:0!important;
  top:0!important;
  width:1280px!important;
  height:832px!important;
  background:url('img/bg-equipe.png') center center / cover no-repeat!important;
}
.ecosystem::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:-1!important;
  inset:0!important;
  background:rgba(0,0,0,.80)!important;
}

/* ---------- LIVRO ---------- */
.book>img{
  left:447px!important;
  top:61px!important;
  width:873px!important;
  height:728px!important;
  object-fit:cover!important;
  border-radius:0!important;
  filter:none!important;
}
.book-copy{
  left:215px!important;
  top:245px!important;
  width:427px!important;
}
.book-title{
  width:361px!important;
  margin:0!important;
  color:#000!important;
  text-transform:uppercase!important;
}
.book-title span{
  display:block!important;
  font-size:20px!important;
  line-height:30px!important;
  font-weight:500!important;
}
.book-title strong{
  display:block!important;
  font-size:24px!important;
  line-height:30px!important;
  font-weight:800!important;
}
.book-description{
  width:361px!important;
  margin-top:25px!important;
  font-size:16px!important;
  line-height:32px!important;
  font-weight:500!important;
  color:#000!important;
}
.book-description p{
  margin:0 0 25px!important;
  width:361px!important;
  font-size:16px!important;
  line-height:32px!important;
}
.book-description strong{font-weight:800!important}
.book-copy>.btn{
  position:absolute!important;
  left:1px!important;
  top:353px!important;
  width:426px!important;
  margin:0!important;
}

/* ---------- FORMULÁRIO / FUNDO CORRETO ---------- */
.contact{
  background:none!important;
  isolation:isolate!important;
  overflow:hidden!important;
}
.contact::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:-2!important;
  left:-109.824px!important;
  top:-12.465px!important;
  width:1499.52px!important;
  height:843.465px!important;
  background:url('img/bg-contato.png') 0 0 / 1499.52px 843.465px no-repeat!important;
}
.contact::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:-1!important;
  inset:0!important;
  background:rgba(0,0,0,.77)!important;
}
.lead-form{
  left:570px!important;
  top:40px!important;
  width:535px!important;
  height:624px!important;
  padding:0!important;
  border-radius:20px!important;
  background:rgba(0,0,0,.41)!important;
}
.lead-form>input{
  left:26px!important;
  width:483px!important;
  height:21px!important;
  box-sizing:border-box!important;
  background:#fff!important;
  border:1px solid #d9d9d9!important;
  border-radius:5px!important;
  color:#444!important;
  padding:2px 8px!important;
}
.lead-form .field-name{top:20px!important}
.lead-form .field-phone{top:47px!important}
.lead-form .field-email{top:74px!important}
.lead-form .invest-fieldset{left:26px!important;top:108px!important;width:483px!important}
.lead-form .segment-fieldset{left:26px!important;top:241px!important;width:483px!important}
.lead-form .project-field{
  left:26px!important;
  top:348px!important;
  width:483px!important;
  height:62px!important;
  box-sizing:border-box!important;
  background:#fff!important;
  color:#444!important;
}
.consent-block{
  left:26px!important;
  top:432px!important;
  width:483px!important;
}
.lead-form .form-submit{
  left:26px!important;
  top:547px!important;
  width:483px!important;
  height:54px!important;
}

/* ---------- RODAPÉ / continuação exata do mesmo fundo ---------- */
.footer{
  background:none!important;
  overflow:hidden!important;
  isolation:isolate!important;
}
.footer::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:-2!important;
  left:-109.824px!important;
  top:-704.465px!important;
  width:1499.52px!important;
  height:843.465px!important;
  background:url('img/bg-contato.png') 0 0 / 1499.52px 843.465px no-repeat!important;
}
.footer::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:-1!important;
  inset:0!important;
  background:rgba(0,0,0,.73)!important;
}
.footer-follow{
  left:105px!important;
  top:51px!important;
  width:230px!important;
  height:39px!important;
  font-size:14px!important;
  line-height:20px!important;
  text-transform:none!important;
}
.footer-social{
  position:absolute!important;
  left:383px!important;
  top:63px!important;
  width:103px!important;
  height:23px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
}
.footer-social a{
  position:static!important;
  display:block!important;
  border:0!important;
  outline:0!important;
}
.footer-social .social-ig{width:23px!important;height:23px!important}
.footer-social .social-in{width:26px!important;height:23px!important;border:0!important}
.footer-social .social-wa{width:23px!important;height:23px!important}
.footer-social img{
  position:static!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  filter:invert(1) brightness(2)!important;
}
.footer-gdesign{
  left:582px!important;
  top:55px!important;
  width:116px!important;
  height:30px!important;
  filter:invert(1) brightness(2)!important;
}
.footer-group{
  left:861px!important;
  top:54px!important;
  width:313px!important;
  height:31px!important;
}

/* Toda imagem fotográfica deve usar interpolação normal, sem filtros. */
.hero img,
.panorama img,
.value-images img,
.case-main,
.case-thumbs img,
.testimonial-card img,
.book>img{
  image-rendering:auto!important;
  filter:none!important;
}


/* ==========================================================
   212-NODE RESPONSIVE RECONSTRUCTION
   Desktop preserves the Figma-calibrated 1280px composition.
   Mobile/tablet switch to real document flow (no transform:scale).
   ========================================================== */

@media (min-width: 821px) {
  html, body { min-width: 0 !important; }
  body { min-height: 100vh !important; }
  .site {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    margin: 0 auto !important;
    transform: none !important;
  }
}

@media (max-width: 820px) {
  html, body {
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    overflow-x: hidden !important;
    background: #fff !important;
  }

  .site {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    transform: none !important;
    overflow: hidden !important;
  }

  .site > header,
  .site > section,
  .site > footer {
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
  }

  .container {
    width: min(100% - 32px, 680px) !important;
    max-width: none !important;
    margin-inline: auto !important;
  }

  .header {
    height: 72px !important;
    padding: 0 20px !important;
    background: #111 !important;
  }
  .header .brand { width: 118px !important; height: auto !important; }
  .header-social { gap: 12px !important; }
  .header-social img { width: 24px !important; height: 24px !important; }

  .hero,
  .hero .track,
  .hero .slide {
    height: clamp(250px, 70vw, 360px) !important;
  }
  .hero .slide img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
  .hero .navbtn { width: 34px !important; height: 34px !important; }
  .hero .navbtn.prev { left: 14px !important; }
  .hero .navbtn.next { right: 14px !important; }

  .hero-intro {
    padding: 34px 16px 38px !important;
    min-height: 0 !important;
  }
  .hero-intro .container {
    height: auto !important;
    width: 100% !important;
  }
  .hero-intro h1,
  .hero-intro .lead,
  .hero-intro .pills,
  .hero-intro .hero-wa {
    position: static !important;
    width: auto !important;
    height: auto !important;
    inset: auto !important;
  }
  .hero-intro h1 {
    font-size: clamp(28px, 8.6vw, 40px) !important;
    line-height: 1.02 !important;
    letter-spacing: 2px !important;
    text-align: center !important;
  }
  .hero-intro .lead {
    margin: 16px auto 24px !important;
    max-width: 560px !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
    text-align: center !important;
  }
  .hero-intro .hero-wa { display: none !important; }
  .pills {
    display: flex !important;
    gap: 8px !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
  }
  .pill {
    font-size: 11px !important;
    padding: 10px 14px !important;
  }

  .value {
    padding: 34px 0 44px !important;
  }
  .stats {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 10px !important;
  }
  .stat { height: 110px !important; padding: 12px !important; }
  .stat strong { font-size: 28px !important; }
  .stat span { font-size: 11px !important; }
  .value-row {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    margin-top: 28px !important;
  }
  .value-copy h2 { font-size: 23px !important; line-height: 1.18 !important; }
  .value-copy p { font-size: 15px !important; line-height: 1.7 !important; }
  .value-images {
    height: auto !important;
    display: grid !important;
    gap: 12px !important;
  }
  .value-images .back,
  .value-images .front {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: cover !important;
  }

  .btn {
    max-width: 100% !important;
    white-space: normal !important;
    text-align: center !important;
    line-height: 1.25 !important;
  }

  .logo-section {
    height: auto !important;
    min-height: 220px !important;
    padding: 28px 0 !important;
  }
  .logo-viewport { width: calc(100% - 72px) !important; }
  .logo-track {
    grid-template-rows: repeat(2, 72px) !important;
    grid-auto-columns: 96px !important;
    gap: 0 10px !important;
  }
  .logo-cell img { max-width: 82px !important; max-height: 48px !important; }
  .logo-arrow { width: 30px !important; }
  .logo-arrow.prev { left: 12px !important; }
  .logo-arrow.next { right: 12px !important; }

  .panorama,
  .panorama .track,
  .panorama .pan-slide {
    height: clamp(240px, 70vw, 360px) !important;
  }
  .panorama .pan-slide > img,
  .panorama .pan-slide > img.figma-pan-prmn,
  .panorama .pan-slide > img.figma-pan-zoo {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
  }
  .panorama .navbtn.prev { left: 14px !important; }
  .panorama .navbtn.next { right: 14px !important; }

  .why, .solutions {
    padding: 42px 0 52px !important;
  }
  .section-title {
    font-size: 22px !important;
    line-height: 1.2 !important;
    margin-bottom: 26px !important;
  }
  .why-grid,
  .solution-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .info-card,
  .solution-card {
    height: auto !important;
    min-height: 0 !important;
    padding: 24px 22px !important;
  }

  .vertical {
    padding: 48px 16px 52px !important;
    background: #fff !important;
  }
  .vertical.v2 { background: #f8f8f7 !important; }
  .vertical .title,
  .vertical .v-copy,
  .vertical .v-img,
  .vertical .cta-row {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 0 24px !important;
  }
  .vertical .title { font-size: 23px !important; line-height: 1.2 !important; }
  .v-copy h3 { margin-bottom: 16px !important; }
  .v-copy p { line-height: 1.7 !important; }
  .vertical .v-img {
    aspect-ratio: 16 / 9 !important;
    object-fit: cover !important;
    border-radius: 18px !important;
  }
  .vertical .cta-row { margin-bottom: 0 !important; }

  .cases {
    padding: 44px 0 54px !important;
  }
  .case-viewport {
    width: 100% !important;
    max-width: 100% !important;
  }
  .case-track { width: auto !important; max-width: none !important; }
  .case-slide {
    flex: 0 0 100% !important;
    width: 100% !important;
    min-width: 100% !important;
    min-height: 0 !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    padding: 14px 42px 0 !important;
  }
  .case-copy,
  .case-copy p,
  .case-gallery,
  .case-main,
  .case-thumbs {
    width: 100% !important;
  }
  .case-copy p { line-height: 1.7 !important; }
  .case-main { height: auto !important; aspect-ratio: 16 / 9 !important; }
  .case-thumbs { grid-template-columns: repeat(3,1fr) !important; }
  .case-thumbs img { height: auto !important; aspect-ratio: 1 / 1 !important; }
  .case-nav .prev { left: 5px !important; }
  .case-nav .next { right: 5px !important; }

  .testimonials {
    padding: 48px 0 58px !important;
  }
  .testimonial-viewport {
    width: min(100% - 72px, 360px) !important;
  }
  .testimonial-track { gap: 12px !important; }
  .testimonial-card {
    flex: 0 0 100% !important;
    width: 100% !important;
    height: auto !important;
    min-height: 370px !important;
  }
  .testimonial-nav .prev { left: 8px !important; }
  .testimonial-nav .next { right: 8px !important; }

  .stories { padding: 0 0 52px !important; }
  .team-bg { height: clamp(300px, 80vw, 430px) !important; }
  .story-panel {
    width: calc(100% - 24px) !important;
    margin: -90px auto 0 !important;
    padding: 28px 18px 34px !important;
    border-radius: 28px 28px 0 0 !important;
  }
  .story-grid {
    display: flex !important;
    gap: 12px !important;
    overflow: hidden !important;
  }
  .story-card {
    flex: 0 0 calc(50% - 6px) !important;
    height: 260px !important;
  }

  .ecosystem {
    min-height: 0 !important;
    padding: 70px 20px 64px !important;
  }
  .ecosystem .badge { width: 150px !important; margin-bottom: 30px !important; }
  .ecosystem .eyebrow { font-size: 18px !important; margin-bottom: 28px !important; }
  .ecosystem .copy { font-size: 15px !important; line-height: 1.6 !important; }
  .eco-pills {
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    margin-top: 30px !important;
  }
  .eco-pill { height: 58px !important; font-size: 13px !important; }

  .book {
    padding: 52px 20px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 26px !important;
  }
  .book img,
  .book-copy {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    height: auto !important;
  }
  .book img {
    order: 2 !important;
    aspect-ratio: 4 / 3 !important;
    object-fit: cover !important;
  }
  .book-copy { order: 1 !important; }
  .book-copy h2 { font-size: 23px !important; }
  .book-copy p { line-height: 1.7 !important; }

  .contact {
    min-height: 0 !important;
    padding: 58px 20px !important;
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }
  .contact h2 { font-size: 26px !important; }
  .lead-form {
    width: 100% !important;
    padding: 24px 20px !important;
  }

  .footer {
    min-height: 130px !important;
    height: auto !important;
    padding: 28px 20px !important;
    gap: 18px !important;
    justify-content: center !important;
    text-align: center !important;
  }
  .footer img { max-width: 150px !important; }

  .wa-float {
    width: 54px !important;
    height: 54px !important;
    right: 16px !important;
    bottom: 16px !important;
  }
}

@media (max-width: 430px) {
  .stats { grid-template-columns: 1fr 1fr !important; }
  .case-slide { padding-inline: 34px !important; }
  .story-card { flex-basis: 78% !important; }
  .eco-pills { grid-template-columns: 1fr !important; }
}


/* ==========================================================================
   V9 — ajustes de fidelidade apos comparacao print-a-print com o Figma
   ========================================================================== */
@media (min-width: 821px) {

  /* Titulo do hero: era 40px/4px de tracking; no Figma e 48px quase sem tracking */
  .hero-intro h1 {
    left: 136px !important;
    width: 950px !important;
    font-size: 48px !important;
    line-height: 50px !important;
    letter-spacing: .5px !important;
    height: 50px !important;
  }

  /* Linha de apoio: mesmo corpo, mas com tracking */
  .hero-intro .lead {
    left: 131px !important;
    width: 950px !important;
    letter-spacing: 1.1px !important;
  }

  /* Botao de WhatsApp do hero: 72px e alinhado a borda do bloco */
  .hero-wa {
    right: 0 !important;
    top: 32px !important;
    width: 72px !important;
    height: 72px !important;
  }
  .hero-wa svg { width: 42px !important; height: 42px !important; }

  /* Aba amarela: centralizada so nos cards de numero e nos de solucao.
     Nos cards de "por que escolher" ela e alinhada a esquerda. */
  .info-card:before {
    left: 28px !important;
    transform: none !important;
  }
}

/* Setas dos carrosseis: chevron amarelo sem circulo, como no Figma */
.navbtn,
.logo-arrow {
  width: 20px !important;
  height: 34px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}
.navbtn img,
.logo-arrow img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  filter: none !important;
}
.navbtn.prev, .logo-arrow.prev { left: 104px !important; }
.navbtn.next, .logo-arrow.next { right: 104px !important; }
.case-nav .prev { left: 75px !important; }
.case-nav .next { right: 75px !important; }
.testimonial-nav .prev { left: 85px !important; }
.testimonial-nav .next { right: 85px !important; }
.testimonial-nav .navbtn img { filter: grayscale(1) !important; opacity: .55 !important; }

/* Os dois primeiros slides de panorama voltaram a ser as fotos originais
   de 1280x477; os recortes forcados da V8 nao se aplicam mais. */
.panorama .pan-slide > img.figma-pan-prmn,
.panorama .pan-slide > img.figma-pan-zoo {
  height: 100% !important;
  top: 0 !important;
  left: 0 !important;
  object-fit: cover !important;
}


/* ==========================================================================
   V9.2 — segunda rodada de comparacao com o Figma
   ========================================================================== */
@media (min-width: 821px) {

  /* --- entrelinhas: o Figma respira ~20% mais que a V8 em todo o corpo --- */
  .section-title      { font-size:23px!important; line-height:30px!important; }
  .vertical .title    { font-size:23px!important; line-height:30px!important; }
  .v-copy h3          { font-size:20px!important; line-height:26px!important; }
  .v-copy p           { font-size:15px!important;  line-height:33px!important; }
  .case-copy p        { font-size:15px!important;  line-height:28px!important; }

  /* --- LIVRO: o PNG do no trazia o texto e o botao da prancheta cravados.
         Agora e so o livro, entao a caixa muda de tamanho e posicao. --- */
  .book > img {
    left:640px!important; top:130px!important;
    width:475px!important; height:630px!important;
    object-fit:contain!important; border-radius:0!important;
  }
  .book-description { margin-top:39px!important; }

  /* --- CONTEUDOS / REELS --- */
  /* 4 cards de 215px + 3 vaos de 17px = 911px de janela */
  .story-viewport { width:911px!important; }
  /* o botao SAIBA MAIS saiu de dentro do PNG e voltou a ser elemento */
  .story-card > img { height:320px!important; }
  .story-tag { bottom:6px!important; }

  /* --- ECOSSISTEMA --- */
  .ecosystem::before { background-image:url('img/bg-ecossistema.png')!important; }
  .ecosystem .eyebrow {
    font-size:26px!important; line-height:34px!important;
    font-weight:500!important; text-transform:uppercase!important;
    max-width:760px!important; margin:0 auto 38px!important;
  }
  .ecosystem .eyebrow strong { font-weight:800!important; }
  .eco-logos img { background:transparent!important; }

  /* --- CONTATO --- */
  .contact h2 {
    font-size:27px!important; line-height:34px!important;
    text-transform:uppercase!important; font-weight:500!important;
  }
  .contact h2 strong { font-weight:800!important; }
  /* no Figma o formulario nao tem painel escuro atras */
  .lead-form { background:transparent!important; padding:0!important; }
  .lead-form .consent-note,
  .lead-form .privacy { margin-bottom:18px!important; }
}

@media (min-width: 821px) {
  /* a foto da equipe agora e o recorte limpo de 1280x331; sem zoom */
  .team-bg {
    height:331px!important;
    background-image:url('img/bg-equipe.png')!important;
    background-size:1280px 331px!important;
    background-position:0 0!important;
    background-repeat:no-repeat!important;
  }
  /* no Figma as setas dos reels sao cinza, nao amarelas */
  .stories .navbtn img,
  .stories .logo-arrow img { filter:grayscale(1) brightness(1.9)!important; opacity:.85!important; }
}


/* ==========================================================================
   V9.3 — contato, rodape e ecossistema
   ========================================================================== */
@media (min-width: 821px) {

  /* --- CONTATO --- */
  /* 23px/30px cabe em 3 linhas na coluna de 342px, como no Figma.
     A V9.2 tinha posto 27px, que quebrava em 4 e encavalava o paragrafo. */
  .contact h2 { font-size:23px!important; line-height:30px!important; }
  .contact p  { font-size:15px!important; line-height:32px!important; }
  /* .contact p vencia .form-fine por especificidade e inflava a letra miuda,
     empurrando o texto por baixo do botao */
  .contact .form-fine {
    font-size:12px!important; line-height:14px!important; margin:13px 0 0!important;
  }
  .lead-form { background:transparent!important; }

  /* --- RODAPE: faixa escura solida, nao a foto do contato --- */
  .footer::before {
    background-image:none!important;
    background-color:#141414!important;
    left:0!important; top:0!important;
    width:1280px!important; height:140px!important;
  }
  .footer::after { background:transparent!important; }
  .footer-group img { width:150px!important; height:34px!important; }

  /* --- ECOSSISTEMA --- */
  /* o :before nao cobria a altura toda e sobrava faixa cinza embaixo */
  .ecosystem::before {
    inset:0!important; left:0!important; top:0!important;
    width:1280px!important; height:100%!important;
    background-size:cover!important; background-position:center!important;
  }
  .ecosystem .eyebrow { max-width:830px!important; }
  .eco-logos img { height:34px!important; width:auto!important; }
}

@media (min-width: 821px) {
  /* o fieldset de segmento tinha altura travada e escondia "Outro Segmento" */
  .lead-form .invest-fieldset  { top:115px!important; height:auto!important; }
  .lead-form .segment-fieldset { top:230px!important; height:auto!important; overflow:visible!important; }
  .lead-form .project-field    { top:354px!important; }
  /* .footer img:nth-of-type(1) vencia por especificidade e cortava a marca */
  .footer .footer-group img { width:150px!important; height:34px!important; object-fit:contain!important; }
}

@media (min-width: 821px) {
  /* o fieldset de segmento ainda passava por baixo da textarea */
  .lead-form .segment-fieldset { padding:0!important; }
  .lead-form .segment-fieldset legend { margin-bottom:2px!important; }
  .lead-form .segment-fieldset label  { line-height:18px!important; margin:0!important; }
  .footer .footer-group img { width:auto!important; height:31px!important; }
}

/* ========================================================================== 
   V9.4 — correções solicitadas em 28/08/2026
   Esta camada complementa a V9.3 original sem alterar as demais seções.
   ========================================================================== */

/* Cabeçalho: mesma prancheta de 1280px, fundo branco e alinhamento do Figma. */
.header{
  top:0!important;
  height:96px!important;
  padding:0!important;
  background:#fff!important;
  overflow:hidden!important;
}
.header-brand{
  position:absolute!important;
  left:104px!important;
  top:23px!important;
  width:138px!important;
  height:36px!important;
}
.header-brand img{
  width:138px!important;
  height:36px!important;
  object-fit:contain!important;
  filter:none!important;
}
.header-social .social-ig{left:1072px!important;top:31px!important;width:23px!important;height:23px!important}
.header-social .social-in{left:1110px!important;top:31px!important;width:26px!important;height:23px!important}
.header-social .social-wa{left:1152px!important;top:31px!important;width:23px!important;height:23px!important}
.header-social a img{width:100%!important;height:100%!important;object-fit:contain!important;filter:none!important}

/* Logos: cada página ocupa exatamente um viewport; nenhum logo pode invadir o vizinho. */
.logo-section{height:232px!important;overflow:hidden!important;background:#fff!important}
.logo-viewport{left:0!important;top:0!important;width:1280px!important;height:232px!important;overflow:hidden!important}
.logo-track{display:flex!important;width:2560px!important;height:232px!important;gap:0!important}
.logo-page{flex:0 0 1280px!important;width:1280px!important;height:232px!important;align-content:center!important;justify-content:center!important}
.logo-page.page-primary{grid-template-columns:repeat(8,113px)!important;grid-template-rows:repeat(2,113px)!important;column-gap:7px!important}
.logo-page.page-secondary{grid-template-columns:repeat(5,113px)!important;grid-template-rows:repeat(2,113px)!important;column-gap:7px!important}
.logo-cell{width:113px!important;height:113px!important;overflow:hidden!important;padding:0!important}
.logo-cell img{width:113px!important;height:113px!important;max-width:none!important;max-height:none!important;object-fit:contain!important;transform:none!important;background:#fff!important}
.logo-arrow{top:101px!important;width:17px!important;height:29px!important}
.logo-arrow.prev{left:104px!important}.logo-arrow.next{right:104px!important}
.logo-arrow img{width:17px!important;height:29px!important}

/* Verticais: remove a interseção física entre as fotografias. */
.v1 .img1{left:554px!important;top:200px!important;width:620px!important;height:317px!important}
.v1 .img2{left:105px!important;top:532px!important;width:620px!important;height:300px!important}
.v1 .c2{left:771px!important;top:565px!important}
.v2 .img1{left:554px!important;top:98px!important;width:620px!important;height:317px!important}
.v2 .img2{left:105px!important;top:430px!important;width:620px!important;height:300px!important}
.v2 .c2{left:771px!important;top:462px!important}
.v-image-frame>img{width:100%!important;height:100%!important;left:0!important;top:0!important;object-fit:cover!important}

/* Arquitetura, experiência e vendas: restaura o enquadramento alto da foto da equipe. */
.stories{height:830px!important;overflow:hidden!important;background:#fff!important}
.team-bg{
  position:absolute!important;
  left:0!important;top:0!important;
  width:1280px!important;height:518px!important;
  background-image:url('img/bg-equipe.png')!important;
  background-size:122.05% 89.77%!important;
  background-position:-6.96% 0!important;
  background-repeat:no-repeat!important;
  background-color:#fff!important;
}
.story-panel{
  left:149px!important;top:331px!important;
  width:967px!important;height:470px!important;
  border-radius:30px 30px 0 0!important;
  background:#fff!important;overflow:hidden!important;
}
.story-panel .section-title{left:74px!important;top:27px!important;width:834px!important;height:36px!important;margin:0!important;font-size:20px!important;line-height:36px!important}
.story-viewport{position:absolute!important;left:31px!important;top:80px!important;width:895px!important;height:368px!important;overflow:hidden!important}
.story-grid{position:relative!important;left:0!important;top:0!important;display:flex!important;width:max-content!important;height:368px!important;gap:17px!important;overflow:visible!important;transition:transform .55s cubic-bezier(.65,0,.35,1)!important;will-change:transform}
.story-card{position:relative!important;flex:0 0 215px!important;width:215px!important;height:368px!important;overflow:visible!important;border-radius:0!important;background:transparent!important}
.story-card>img,.story-crop-source{position:relative!important;left:0!important;top:0!important;display:block!important;width:215px!important;height:320px!important;border-radius:20px!important;overflow:hidden!important;object-fit:cover!important}
.story-crop-source img{position:static!important;width:215px!important;height:320px!important;max-width:none!important;object-fit:cover!important}
.story-tag{left:50%!important;bottom:0!important;width:136px!important;height:29px!important;background:#fed702!important;color:#000!important}
.story-nav{position:absolute!important;left:0!important;top:568px!important;width:1280px!important;height:29px!important;pointer-events:none!important;z-index:8!important}
.story-arrow{position:absolute!important;top:0!important;width:17px!important;height:29px!important;border:0!important;background:transparent!important;padding:0!important;pointer-events:auto!important;cursor:pointer!important}
.story-arrow.prev{left:104px!important}.story-arrow.next{right:104px!important}
.story-arrow img{display:block!important;width:17px!important;height:29px!important;filter:grayscale(1) brightness(.72)!important;opacity:.62!important}
.story-arrow.next img{transform:rotate(180deg)!important}

/* Ecossistema: fotografia correta apresentada na referência. */
.ecosystem{background:none!important;isolation:isolate!important;overflow:hidden!important}
.ecosystem::before{
  content:""!important;position:absolute!important;z-index:-2!important;inset:0!important;
  width:1280px!important;height:832px!important;
  background:url('img/bg-ecossistema-correto.jpg') center center/cover no-repeat!important;
}
.ecosystem::after{content:""!important;position:absolute!important;z-index:-1!important;inset:0!important;background:rgba(0,0,0,.67)!important}

/* Contato e rodapé: usa o Tropicool correto e mantém continuidade visual. */
.contact::before{
  background-image:url('img/bg-contato-correto.jpg')!important;
  background-size:cover!important;
  background-position:center center!important;
  left:0!important;top:0!important;width:1280px!important;height:691px!important;
}
.footer{background:none!important;isolation:isolate!important;overflow:hidden!important}
.footer::before{
  content:""!important;position:absolute!important;z-index:-2!important;
  left:0!important;top:0!important;width:1280px!important;height:140px!important;
  background:url('img/bg-contato-correto.jpg') center 72%/cover no-repeat!important;
}
.footer::after{content:""!important;position:absolute!important;z-index:-1!important;inset:0!important;background:rgba(0,0,0,.82)!important}
.footer-follow{left:105px!important;top:51px!important;width:230px!important;height:39px!important;font-size:12px!important;line-height:16px!important}
.footer-social{left:383px!important;top:54px!important;width:103px!important;height:32px!important}
.footer-gdesign{left:582px!important;top:55px!important;width:116px!important;height:30px!important;filter:invert(1) brightness(2)!important}
.footer-group{left:861px!important;top:54px!important;width:313px!important;height:31px!important}
.footer .footer-group img{width:auto!important;height:31px!important;object-fit:contain!important}

/* O artboard é escalado como unidade abaixo de 1280px; mantenha a mesma composição. */
@media (max-width: 820px){
  .header,.logo-section,.vertical,.stories,.ecosystem,.footer{width:1280px!important}
}

/* V9.4.1 — robustez de clipping, viewport dos reels e rodapé */
.v-image-frame>img{position:static!important;display:block!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important}
.story-viewport{width:911px!important}
.story-tag{left:39.5px!important;transform:none!important}
.story-card:hover .story-tag,.story-card:focus-visible .story-tag{transform:none!important}
.ecosystem{
  background:linear-gradient(rgba(0,0,0,.74),rgba(0,0,0,.74)),url('img/bg-ecossistema-correto.jpg') center center/cover no-repeat!important;
}
.ecosystem::before,.ecosystem::after{content:none!important;display:none!important}
.footer{
  background:linear-gradient(rgba(0,0,0,.84),rgba(0,0,0,.84)),url('img/bg-contato-correto.jpg') center 72%/cover no-repeat!important;
}
.footer::before,.footer::after{content:none!important;display:none!important}
.footer-gdesign{filter:none!important;object-fit:contain!important}

/* V9.4.2 — as fotos das verticais agora vêm dos assets limpos do build fiel V6.
   Mantemos a composição diagonal original do Figma, sem o recorte duplicado
   que estava gravado dentro dos PNGs da V9.3. */
.v1 .img1{left:554px!important;top:200px!important;width:620px!important;height:317px!important}
.v1 .img2{left:105px!important;top:423px!important;width:620px!important;height:317px!important}
.v2 .img1{left:554px!important;top:98px!important;width:620px!important;height:317px!important}
.v2 .img2{left:105px!important;top:319px!important;width:620px!important;height:317px!important}
.footer-social img{filter:none!important;background:transparent!important}
.footer-social .social-in{border:0!important;border-radius:0!important}

/* ==========================================================
   V9.5 – Correções finas solicitadas pelo cliente
   Header compacto, logos em páginas corretas e stories no enquadramento da referência.
   ========================================================== */

/* -------- Header -------- */
@media (min-width: 821px) {
  .header {
    height: 58px !important;
    padding: 0 !important;
    background: #fff !important;
  }
  .header-brand {
    left: 60px !important;
    top: 12px !important;
    width: 98px !important;
    height: 26px !important;
  }
  .header-brand img {
    width: 98px !important;
    height: 26px !important;
  }
  .header-social .social-ig { left: 1072px !important; top: 17px !important; width: 18px !important; height: 18px !important; }
  .header-social .social-in { left: 1101px !important; top: 17px !important; width: 20px !important; height: 18px !important; }
  .header-social .social-wa { left: 1134px !important; top: 17px !important; width: 18px !important; height: 18px !important; }
}

@media (max-width: 820px) {
  .header {
    height: 58px !important;
    padding: 0 !important;
    background: #fff !important;
    position: relative !important;
    display: block !important;
  }
  .header-brand {
    position: absolute !important;
    left: 20px !important;
    top: 12px !important;
    width: 98px !important;
    height: 26px !important;
    display: block !important;
  }
  .header-brand img {
    width: 98px !important;
    height: 26px !important;
    object-fit: contain !important;
  }
  .header-social {
    position: absolute !important;
    right: 18px !important;
    top: 14px !important;
    display: flex !important;
    gap: 12px !important;
    align-items: center !important;
  }
  .header-social a {
    position: static !important;
    width: auto !important;
    height: auto !important;
  }
  .header-social img {
    width: 18px !important;
    height: 18px !important;
    object-fit: contain !important;
  }
}

/* -------- Carrossel de logos -------- */
.logo-track {
  width: auto !important;
}
.logo-page.page-ref {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #fff !important;
}
.logo-page.page-ref img {
  display: block !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
}

@media (min-width: 821px) {
  .logo-page { flex: 0 0 1280px !important; width: 1280px !important; }
  .logo-page.page-primary {
    grid-template-columns: repeat(8, 113px) !important;
    grid-template-rows: repeat(2, 113px) !important;
  }
  .logo-page.page-ref-2 img { width: 310px !important; height: auto !important; }
  .logo-page.page-ref-3 img { width: 455px !important; height: auto !important; }
}

@media (max-width: 820px) {
  .logo-section {
    height: 220px !important;
    position: relative !important;
    overflow: hidden !important;
    background: #fff !important;
  }
  .logo-viewport,
  .logo-track,
  .logo-page {
    height: 220px !important;
  }
  .logo-viewport {
    width: 100% !important;
    position: relative !important;
    left: auto !important;
    top: auto !important;
  }
  .logo-track {
    display: flex !important;
    transition: transform .55s cubic-bezier(.65,0,.35,1) !important;
  }
  .logo-page {
    flex: 0 0 100% !important;
    width: 100% !important;
  }
  .logo-page.page-primary {
    display: grid !important;
    grid-template-columns: repeat(4, 72px) !important;
    grid-template-rows: repeat(4, 72px) !important;
    justify-content: center !important;
    align-content: center !important;
    gap: 8px !important;
  }
  .logo-cell {
    width: 72px !important;
    height: 72px !important;
  }
  .logo-cell img {
    width: 76px !important;
    height: 76px !important;
    transform: none !important;
  }
  .logo-page.page-ref-2 img { width: 151px !important; height: 149px !important; }
  .logo-page.page-ref-3 img { width: 222px !important; height: 148px !important; }
  .logo-arrow {
    top: 102px !important;
    width: 17px !important;
    height: 29px !important;
  }
  .logo-arrow.prev { left: 18px !important; }
  .logo-arrow.next { right: 18px !important; }
}

/* -------- Stories / Reels -------- */
.stories {
  background: #fff !important;
  overflow: hidden !important;
}
.team-bg {
  background-image: url('img/bg-equipe.png') !important;
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-size: cover !important;
  background-color: #fff !important;
}
.story-panel {
  background: #fff !important;
  overflow: visible !important;
}
.story-panel .section-title {
  text-align: center !important;
  text-transform: uppercase !important;
}
.story-nav {
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
}
.story-arrow {
  position: absolute !important;
  pointer-events: auto !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}
.story-arrow img {
  display: block !important;
}

@media (min-width: 821px) {
  .stories {
    top: 6640px !important;
    height: 605px !important;
    padding: 0 !important;
  }
  .team-bg {
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 1280px !important;
    height: 332px !important;
    margin: 0 !important;
  }
  .story-panel {
    position: absolute !important;
    left: 91px !important;
    top: 202px !important;
    width: 976px !important;
    height: 360px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 28px 28px 0 0 !important;
  }
  .story-panel .section-title {
    position: absolute !important;
    left: 0 !important;
    top: 18px !important;
    width: 976px !important;
    height: auto !important;
    margin: 0 !important;
    font-size: 18px !important;
    line-height: 28px !important;
  }
  .story-viewport {
    position: absolute !important;
    left: 45px !important;
    top: 79px !important;
    width: 886px !important;
    height: 254px !important;
    overflow: hidden !important;
  }
  .story-grid {
    display: flex !important;
    align-items: flex-start !important;
    gap: 14px !important;
    height: 254px !important;
  }
  .story-card {
    flex: 0 0 211px !important;
    width: 211px !important;
    height: 254px !important;
    overflow: visible !important;
  }
  .story-card > img,
  .story-crop-source {
    width: 211px !important;
    height: 214px !important;
    border-radius: 18px !important;
    overflow: hidden !important;
  }
  .story-tag {
    width: 101px !important;
    height: 24px !important;
    line-height: 24px !important;
    font-size: 12px !important;
    letter-spacing: .9px !important;
    bottom: 0 !important;
  }
  .story-arrow {
    top: 372px !important;
    width: 19px !important;
    height: 32px !important;
  }
  .story-arrow.prev { left: 26px !important; }
  .story-arrow.next { right: 26px !important; }
}

@media (max-width: 820px) {
  .stories {
    padding: 0 0 18px !important;
  }
  .team-bg {
    position: relative !important;
    width: 100% !important;
    height: 201px !important;
  }
  .story-panel {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: calc(100% - 94px) !important;
    max-width: 580px !important;
    height: auto !important;
    margin: -33px auto 0 !important;
    padding: 12px 16px 18px !important;
    border-radius: 24px 24px 0 0 !important;
  }
  .story-panel .section-title {
    position: static !important;
    width: auto !important;
    font-size: 15px !important;
    line-height: 21px !important;
    margin: 0 0 12px !important;
  }
  .story-viewport {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: 100% !important;
    height: 205px !important;
    overflow: hidden !important;
  }
  .story-grid {
    display: flex !important;
    gap: 11px !important;
    height: 205px !important;
  }
  .story-card {
    flex: 0 0 129px !important;
    width: 129px !important;
    height: 205px !important;
  }
  .story-card > img,
  .story-crop-source {
    width: 129px !important;
    height: 175px !important;
    border-radius: 16px !important;
  }
  .story-tag {
    width: 84px !important;
    height: 21px !important;
    line-height: 21px !important;
    font-size: 10px !important;
    letter-spacing: .6px !important;
    bottom: 0 !important;
  }
  .story-arrow {
    top: 170px !important;
    width: 18px !important;
    height: 30px !important;
  }
  .story-arrow.prev { left: 20px !important; }
  .story-arrow.next { right: 20px !important; }
  .story-arrow img {
    filter: grayscale(1) brightness(.6) !important;
    opacity: .55 !important;
  }
}

/* ==========================================================
   V10.0 – Stories desktop: fundo completo + reels em tamanho cheio
   Ajuste somente de layout, preservando todos os assets.
   ========================================================== */
@media (min-width: 821px) {
  .stories {
    top: 6640px !important;
    height: 830px !important;
    padding: 0 !important;
    background: #fff !important;
    overflow: hidden !important;
  }

  .team-bg {
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 1280px !important;
    height: 518px !important;
    margin: 0 !important;
    background-image: url('img/bg-equipe.png') !important;
    background-repeat: no-repeat !important;
    background-size: 1280px 518px !important;
    background-position: left top !important;
    background-color: #fff !important;
  }

  .story-panel {
    position: absolute !important;
    left: 95px !important;
    top: 220px !important;
    width: 1090px !important;
    height: 438px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
    border-radius: 28px 28px 0 0 !important;
    overflow: visible !important;
  }

  .story-panel .section-title {
    position: absolute !important;
    left: 0 !important;
    top: 24px !important;
    width: 1090px !important;
    height: auto !important;
    margin: 0 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    font-size: 18px !important;
    line-height: 30px !important;
  }

  .story-viewport {
    position: absolute !important;
    left: 44px !important;
    top: 81px !important;
    width: 902px !important;
    height: 368px !important;
    overflow: hidden !important;
  }

  .story-grid {
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
    display: flex !important;
    align-items: flex-start !important;
    width: max-content !important;
    height: 368px !important;
    gap: 14px !important;
    overflow: visible !important;
    transition: transform .55s cubic-bezier(.65,0,.35,1) !important;
    will-change: transform !important;
  }

  .story-card {
    position: relative !important;
    flex: 0 0 215px !important;
    width: 215px !important;
    height: 368px !important;
    overflow: visible !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  .story-card > img,
  .story-crop-source {
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
    display: block !important;
    width: 215px !important;
    height: 320px !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    object-fit: cover !important;
    object-position: center top !important;
  }

  .story-tag {
    position: absolute !important;
    left: 50% !important;
    bottom: 0 !important;
    transform: translateX(-50%) !important;
    width: 104px !important;
    height: 29px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 100px !important;
    background: #fed702 !important;
    color: #000 !important;
    font-size: 12px !important;
    line-height: 29px !important;
    font-weight: 700 !important;
    letter-spacing: 0.8px !important;
    text-transform: uppercase !important;
  }

  .story-card:hover .story-tag,
  .story-card:focus-visible .story-tag {
    transform: translateX(-50%) !important;
  }

  .story-nav {
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
  }

  .story-arrow {
    position: absolute !important;
    top: 392px !important;
    width: 18px !important;
    height: 31px !important;
    border: 0 !important;
    background: transparent !important;
    padding: 0 !important;
    pointer-events: auto !important;
    cursor: pointer !important;
  }

  .story-arrow.prev { left: 32px !important; }
  .story-arrow.next { right: 32px !important; }

  .story-arrow img {
    display: block !important;
    width: 18px !important;
    height: 31px !important;
    filter: grayscale(1) brightness(.78) !important;
    opacity: .7 !important;
  }

  .story-arrow.next img {
    transform: rotate(180deg) !important;
  }
}

/* ==========================================================
   V10.1 – Qualidade geral + reels centralizados e painel reduzido
   Sem trocar assets; apenas melhora de renderização e layout.
   ========================================================== */

/* melhora a nitidez visual das imagens já existentes */
.hero img,
.panorama img,
.value-images img,
.v-image-frame > img,
.case-main,
.case-thumbs img,
.testimonial-card img,
.book > img,
.story-card > img {
  image-rendering: auto !important;
  filter: none !important;
  backface-visibility: hidden !important;
  transform: translateZ(0) !important;
}

/* evita distorção nas imagens de apoio ao longo da LP */
.v-image-frame > img {
  object-fit: cover !important;
  object-position: center center !important;
}

/* evita leve borrado por escala artificial no carrossel de logos */
.logo-cell img {
  transform: none !important;
}

@media (min-width: 821px) {
  /* seção dos reels */
  .stories {
    top: 6640px !important;
    height: 830px !important;
    padding: 0 !important;
    background: #fff !important;
    overflow: hidden !important;
  }

  .team-bg {
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 1280px !important;
    height: 518px !important;
    margin: 0 !important;
    background-image: url('img/bg-equipe.png') !important;
    background-repeat: no-repeat !important;
    background-size: 1280px 518px !important;
    background-position: left top !important;
    background-color: #fff !important;
  }

  .story-panel {
    position: absolute !important;
    left: 95px !important;
    top: 220px !important;
    width: 1090px !important;
    height: 390px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
    border-radius: 28px 28px 0 0 !important;
    overflow: visible !important;
  }

  .story-panel .section-title {
    position: absolute !important;
    left: 0 !important;
    top: 18px !important;
    width: 1090px !important;
    height: auto !important;
    margin: 0 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    font-size: 18px !important;
    line-height: 30px !important;
  }

  .story-viewport {
    position: absolute !important;
    left: 94px !important;
    top: 82px !important;
    width: 902px !important;
    height: 340px !important;
    overflow: hidden !important;
  }

  .story-grid {
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
    display: flex !important;
    align-items: flex-start !important;
    width: max-content !important;
    height: 340px !important;
    gap: 14px !important;
    overflow: visible !important;
    transition: transform .55s cubic-bezier(.65,0,.35,1) !important;
    will-change: transform !important;
  }

  .story-card {
    position: relative !important;
    flex: 0 0 215px !important;
    width: 215px !important;
    height: 340px !important;
    overflow: visible !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  .story-card > img,
  .story-crop-source {
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
    display: block !important;
    width: 215px !important;
    height: 310px !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    object-fit: cover !important;
    object-position: center center !important;
    image-rendering: auto !important;
    filter: none !important;
    transform: none !important;
  }

  .story-tag {
    position: absolute !important;
    left: 50% !important;
    bottom: 0 !important;
    transform: translateX(-50%) !important;
    width: 104px !important;
    height: 29px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 100px !important;
    background: #fed702 !important;
    color: #000 !important;
    font-size: 12px !important;
    line-height: 29px !important;
    font-weight: 700 !important;
    letter-spacing: 0.8px !important;
    text-transform: uppercase !important;
  }

  .story-card:hover .story-tag,
  .story-card:focus-visible .story-tag {
    transform: translateX(-50%) !important;
  }

  .story-nav {
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
  }

  .story-arrow {
    position: absolute !important;
    top: 389px !important;
    width: 18px !important;
    height: 31px !important;
    border: 0 !important;
    background: transparent !important;
    padding: 0 !important;
    pointer-events: auto !important;
    cursor: pointer !important;
  }

  .story-arrow.prev { left: 30px !important; }
  .story-arrow.next { right: 30px !important; }

  .story-arrow img {
    display: block !important;
    width: 18px !important;
    height: 31px !important;
    filter: grayscale(1) brightness(.78) !important;
    opacity: .7 !important;
  }

  .story-arrow.next img {
    transform: rotate(180deg) !important;
  }
}

/* ==========================================================
   V10.2 – Ajuste solicitado: abaixar o fundo branco dos reels ~5 cm
   Preserva todas as imagens do arquivo enviado.
   ========================================================== */
@media (min-width: 821px) {
  .story-panel {
    top: 410px !important;
  }

  .story-arrow {
    top: 579px !important;
  }
}

/* ==========================================================
   V10.3 – Ajuste solicitado: subir painel dos reels ~2 cm e cortar laterais.
   Preserva o restante do arquivo enviado.
   ========================================================== */
@media (min-width: 821px) {
  .story-panel {
    top: 334px !important;
    left: 148px !important;
    width: 984px !important;
  }

  .story-panel .section-title {
    width: 984px !important;
  }

  .story-viewport {
    left: 41px !important;
    width: 902px !important;
  }

  .story-arrow {
    top: 503px !important;
  }
}

/* ==========================================================
   V10.4 – Ajuste fino do rodapé (alinhamento)
   Preserva imagens e corrige apenas o posicionamento dos elementos.
   ========================================================== */
@media (min-width: 821px) {
  .footer {
    height: 140px !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  .footer-follow {
    position: absolute !important;
    left: 78px !important;
    top: 50px !important;
    width: 240px !important;
    height: 40px !important;
    margin: 0 !important;
    color: #fff !important;
    font-size: 12px !important;
    line-height: 16px !important;
    font-weight: 400 !important;
    text-transform: uppercase !important;
  }

  .footer-social {
    position: absolute !important;
    left: 384px !important;
    top: 67px !important;
    width: 94px !important;
    height: 23px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }

  .footer-social .social-ig,
  .footer-social .social-wa {
    width: 23px !important;
    height: 23px !important;
  }

  .footer-social .social-in {
    width: 26px !important;
    height: 23px !important;
  }

  .footer-social img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
  }

  .footer-gdesign {
    position: absolute !important;
    left: 540px !important;
    top: 57px !important;
    width: 126px !important;
    height: 33px !important;
    object-fit: contain !important;
  }

  .footer-group {
    position: absolute !important;
    left: auto !important;
    right: 78px !important;
    top: 52px !important;
    width: 338px !important;
    height: 36px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 22px !important;
    color: #fff !important;
  }

  .footer-group p {
    width: 165px !important;
    height: auto !important;
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 15px !important;
  }

  .footer-group strong {
    font-weight: 800 !important;
  }

  .footer .footer-group img {
    width: auto !important;
    height: 31px !important;
    object-fit: contain !important;
  }
}

/* ==========================================================
   V10.5 – Rodapé centralizado no modelo horizontal
   Todos os blocos centralizados ao meio do rodapé.
   ========================================================== */
@media (min-width: 821px) {
  .footer {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 54px !important;
    padding: 0 48px !important;
  }

  .footer-follow,
  .footer-social,
  .footer-gdesign,
  .footer-group {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    margin: 0 !important;
    flex: 0 0 auto !important;
  }

  .footer-follow {
    width: 235px !important;
    height: auto !important;
    text-align: left !important;
    font-size: 12px !important;
    line-height: 16px !important;
    text-transform: uppercase !important;
  }

  .footer-social {
    width: 94px !important;
    height: 23px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }

  .footer-social .social-ig,
  .footer-social .social-wa {
    width: 23px !important;
    height: 23px !important;
  }

  .footer-social .social-in {
    width: 26px !important;
    height: 23px !important;
  }

  .footer-social img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
  }

  .footer-gdesign {
    width: 126px !important;
    height: 33px !important;
    object-fit: contain !important;
  }

  .footer-group {
    width: auto !important;
    max-width: 345px !important;
    height: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 18px !important;
  }

  .footer-group p {
    width: 162px !important;
    height: auto !important;
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 15px !important;
    text-align: left !important;
  }

  .footer .footer-group img {
    width: auto !important;
    height: 31px !important;
    object-fit: contain !important;
  }
}

/* ==========================================================
   V10.6 – Rodapé conforme referência enviada
   Quatro blocos horizontais, com alinhamento vertical único.
   ========================================================== */
@media (min-width: 821px) {
  .footer {
    display: block !important;
    position: absolute !important;
    height: 140px !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: linear-gradient(rgba(0,0,0,.84),rgba(0,0,0,.84)), url('img/bg-contato-correto.jpg') center 72% / cover no-repeat !important;
  }

  .footer-follow,
  .footer-social,
  .footer-gdesign,
  .footer-group {
    position: absolute !important;
    margin: 0 !important;
    transform: none !important;
  }

  /* bloco 1 — chamada */
  .footer-follow {
    left: 94px !important;
    top: 56px !important;
    width: 242px !important;
    height: 36px !important;
    color: #fff !important;
    font-size: 12px !important;
    line-height: 17px !important;
    font-weight: 400 !important;
    text-align: left !important;
    text-transform: uppercase !important;
  }

  /* bloco 2 — redes sociais */
  .footer-social {
    left: 396px !important;
    top: 66px !important;
    width: 112px !important;
    height: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0 !important;
  }
  .footer-social a {
    position: static !important;
    display: block !important;
    flex: 0 0 auto !important;
  }
  .footer-social .social-ig,
  .footer-social .social-wa {
    width: 24px !important;
    height: 24px !important;
  }
  .footer-social .social-in {
    width: 26px !important;
    height: 24px !important;
  }
  .footer-social img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    filter: none !important;
  }

  /* bloco 3 — GDesign */
  .footer-gdesign {
    left: 612px !important;
    top: 58px !important;
    width: 127px !important;
    height: 34px !important;
    object-fit: contain !important;
    filter: none !important;
  }

  /* bloco 4 — grupo + Ecossistema Goakira */
  .footer-group {
    left: 915px !important;
    top: 56px !important;
    width: 340px !important;
    height: 38px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 20px !important;
    color: #fff !important;
  }
  .footer-group p {
    width: 160px !important;
    height: auto !important;
    margin: 0 !important;
    color: #fff !important;
    font-size: 12px !important;
    line-height: 15px !important;
    font-weight: 400 !important;
    text-align: left !important;
  }
  .footer-group strong {
    display: block !important;
    font-weight: 800 !important;
  }
  .footer .footer-group img {
    display: block !important;
    width: 150px !important;
    height: 34px !important;
    object-fit: contain !important;
    max-width: none !important;
    max-height: none !important;
  }
}

/* ==========================================================
   V10.7 – Rodapé: ajuste fino dos ícones sociais
   Mantém o rodapé horizontal e eleva o Instagram.
   ========================================================== */
@media (min-width: 821px) {
  .footer-social {
    left: 396px !important;
    top: 66px !important;
    width: 114px !important;
    height: 24px !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
  }

  .footer-social a {
    position: relative !important;
    display: block !important;
    flex: 0 0 auto !important;
  }

  .footer-social .social-ig {
    width: 24px !important;
    height: 24px !important;
    top: -8px !important;
  }

  .footer-social .social-in {
    width: 26px !important;
    height: 24px !important;
    top: 0 !important;
  }

  .footer-social .social-wa {
    width: 24px !important;
    height: 24px !important;
    top: 0 !important;
  }

  .footer-social img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    filter: none !important;
  }
}

/* ==========================================================
   V10.8 – Rodapé: redes sociais agrupadas novamente
   Mantém o alinhamento atual e reduz apenas o espaçamento entre ícones.
   ========================================================== */
@media (min-width: 821px) {
  .footer-social {
    left: 396px !important;
    top: 66px !important;
    width: auto !important;
    height: 24px !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 13px !important;
  }

  .footer-social a {
    position: relative !important;
    display: block !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
  }

  .footer-social .social-ig {
    width: 24px !important;
    height: 24px !important;
    top: -8px !important;
  }

  .footer-social .social-in {
    width: 26px !important;
    height: 24px !important;
    top: 0 !important;
  }

  .footer-social .social-wa {
    width: 24px !important;
    height: 24px !important;
    top: 0 !important;
  }
}

/* ==========================================================
   V10.9 – Rodapé: espaçamento fixo e compacto entre ícones sociais
   Corrige definitivamente o espalhamento causado por regras anteriores.
   ========================================================== */
@media (min-width: 821px) {
  .footer-social {
    position: absolute !important;
    left: 396px !important;
    top: 66px !important;
    width: 94px !important;
    height: 32px !important;
    display: block !important;
  }

  .footer-social a {
    position: absolute !important;
    display: block !important;
    margin: 0 !important;
  }

  .footer-social .social-ig {
    left: 0 !important;
    top: -8px !important;
    width: 24px !important;
    height: 24px !important;
  }

  .footer-social .social-in {
    left: 34px !important;
    top: 0 !important;
    width: 26px !important;
    height: 24px !important;
  }

  .footer-social .social-wa {
    left: 70px !important;
    top: 0 !important;
    width: 24px !important;
    height: 24px !important;
  }
}

/* ==========================================================
   V10.10 – Ajustes de alinhamento e respiro no desktop
   28/08/2026
   - Header: centraliza verticalmente logo e ícones na área branca de 96px.
   - Logos: reduz em ~1 cm o respiro branco inferior antes do próximo bloco.
   - Why/Solutions: acrescenta ~1 cm de respiro acima do conteúdo interno.
   ========================================================== */
@media (min-width: 821px) {
  /* O hero já começa em y=96px. O header passa a ocupar toda essa área,
     evitando que logo e redes fiquem visualmente presos ao topo. */
  .header {
    height: 96px !important;
  }

  .header-brand {
    top: 35px !important;
  }

  .header-social .social-ig,
  .header-social .social-in,
  .header-social .social-wa {
    top: 39px !important;
  }

  /* Aproxima em ~1 cm todo o conteúdo posterior do carrossel de clientes.
     Assim o espaço branco abaixo dos logos cai de ~62px para ~25px,
     sem alterar tamanho, proporção ou distribuição das marcas. */
  .logo-section ~ section,
  .logo-section ~ footer {
    transform: translateY(-37px) !important;
  }

  /* Mantém a composição das duas seções, mas cria o respiro solicitado
     entre o início do fundo claro e seus títulos/cards. */
  .why > .container,
  .solutions > .container {
    transform: translateY(37px) !important;
  }

  /* Compensa o deslocamento vertical das seções seguintes para não deixar
     uma faixa branca excedente depois do rodapé. */
  .site {
    height: 9928px !important;
  }
}

/* ==========================================================
   Ajuste do painel de contato para o formulário RD Station
   - O form antigo (estático) tinha altura fixa de 624px; o
     formulário real do RD Station é mais alto e "vazava" para
     fora do painel escuro, ficando sem fundo e desalinhado.
   - Deixa o painel com altura automática (acompanha o conteúdo
     real do RD Station) e alinha o topo do painel com o topo
     do bloco de texto ao lado (158px), em vez de 40px.
   - Aumenta a seção de contato e empurra o rodapé/canvas para
     baixo na mesma medida, para não haver corte/sobreposição.
   ========================================================== */
@media (min-width: 821px) {
  .contact { height: 1400px !important; overflow: visible !important; }
  .contact::before,
  .contact:before { height: 100% !important; top: 0 !important; background-size: cover !important; }
  .lead-form {
    top: 158px !important;
    height: auto !important;
    min-height: 520px !important;
    overflow: visible !important;
    padding-bottom: 40px !important;
  }
  .footer { top: 10534px !important; }
  .site { height: 10637px !important; }
}

/* ==========================================================
   V10.12 – Ajuste fino do header no desktop
   28/08/2026
   - Mantém a logo como está.
   - Desce somente os ícones sociais para alinhamento visual com a logo.
   ========================================================== */
@media (min-width: 821px) {
  .header-social .social-ig,
  .header-social .social-in,
  .header-social .social-wa {
    top: 43px !important;
  }
}

/* Setas amarelas ocultas por padrão nos carrosséis de fotos (hero, panoramas,
   clientes e cases); aparecem no hover para permitir navegação manual sem
   ficarem visíveis o tempo todo. Autoplay continua ativo em paralelo. */
.hero .navbtn,
.panorama .navbtn,
.case-nav .navbtn,
.logo-arrow {
  opacity: 0 !important;
  transition: opacity .25s ease !important;
}
.hero:hover .navbtn,
.panorama:hover .navbtn,
.cases:hover .case-nav .navbtn,
.logo-section:hover .logo-arrow {
  opacity: 1 !important;
}

/* ==========================================================================
   Correção mobile — reset de posicionamento absoluto residual
   Os resets de seção (.site > section) só alcançam os filhos diretos de
   .site. Muitos elementos internos (netos) continuavam com position:absolute
   e coordenadas em pixel do desktop, fazendo a seção-mãe colapsar (porque
   conteúdo absoluto não conta pra altura) e a seção seguinte subir e
   sobrepor. Este bloco reseta especificamente esses elementos internos.
   ========================================================================== */
@media (max-width: 820px) {

  /* Números (+600, 99% etc.) e bloco "arquitetura não é custo" */
  .stats {
    position: static !important; inset: auto !important; left: auto !important; top: auto !important;
    width: 100% !important; height: auto !important;
  }
  .value-row {
    position: static !important; inset: auto !important; left: auto !important; top: auto !important;
    width: 100% !important; height: auto !important; display: grid !important;
  }
  .value-copy {
    position: static !important; width: 100% !important; height: auto !important;
  }
  .value-copy h2, .value-copy p { width: auto !important; height: auto !important; }
  .value-images {
    position: static !important; left: auto !important; top: auto !important;
    width: 100% !important; height: auto !important;
  }

  /* Carrossel de logos de clientes */
  .logo-viewport {
    position: static !important; left: auto !important; top: auto !important; height: auto !important;
  }

  /* Cards "por que escolher" e "soluções completas" */
  .why-grid, .solution-grid {
    position: static !important; inset: auto !important; left: auto !important; top: auto !important;
    width: 100% !important; height: auto !important;
  }
  .why .cta-row, .solutions .cta-row {
    position: static !important; left: auto !important; top: auto !important;
    width: 100% !important; margin-top: 20px !important;
  }

  /* Livro */
  .book > img {
    position: static !important; left: auto !important; right: auto !important; top: auto !important;
    width: 100% !important; height: auto !important;
  }
  .book-copy {
    position: static !important; left: auto !important; top: auto !important;
    width: 100% !important; padding: 24px 20px !important;
  }
  .book-copy .label, .book-copy h2, .book-copy p, .book-copy .btn {
    position: static !important; width: auto !important; height: auto !important;
  }

  /* Formulário de contato */
  .contact > div:first-child {
    position: static !important; left: auto !important; top: auto !important; width: 100% !important;
  }
  .lead-form {
    position: static !important; inset: auto !important; left: auto !important; top: auto !important;
    width: 100% !important; height: auto !important; display: block !important;
  }
  .lead-form > input,
  .lead-form fieldset,
  .lead-form .invest-fieldset,
  .lead-form .segment-fieldset,
  .lead-form .project-field,
  .lead-form .form-submit,
  .lead-form .btn {
    position: static !important; inset: auto !important; left: auto !important; top: auto !important; bottom: auto !important;
    width: 100% !important; height: auto !important; min-height: 0 !important;
    margin: 0 0 14px !important;
  }

  /* Rodapé */
  .footer {
    display: flex !important; flex-direction: column !important;
    align-items: center !important; gap: 16px !important;
  }
  .footer-follow, .footer-social, .footer-gdesign, .footer-group {
    position: static !important; inset: auto !important; left: auto !important; top: auto !important;
    width: auto !important; height: auto !important;
  }
  .footer-social { display: flex !important; gap: 14px !important; }
  .footer-group {
    display: flex !important; flex-direction: column !important;
    align-items: center !important; gap: 8px !important; text-align: center !important;
  }
}

/* ==========================================================================
   Correção mobile v2 — reset universal de posição + larguras órfãs
   O ajuste anterior corrigia seletor por seletor e sempre sobrava algum
   elemento esquecido com position:absolute e largura fixa em pixels do
   desktop (cabeçalho, formulário, rodapé, cases, stories, ecossistema,
   livro). Esta versão reseta TUDO dentro do .site de uma vez e só reabilita
   posicionamento onde é realmente necessário.
   ========================================================================== */
@media (max-width: 820px) {

  /* 1) Reset universal: todo elemento dentro do .site vira estático.
     position:static ignora left/top/right/bottom automaticamente, então
     não precisa zerar essas propriedades à parte. */
  .site * { position: static !important; }

  /* 2) Reabilita position:relative como referência para pseudo-elementos
     de fundo (::before/::after) e para as setas dos carrosséis. */
  .site > header,
  .site > section,
  .site > footer,
  .slider, .hero, .panorama, .cases, .logo-section,
  .testimonials, .stories, .story-panel, .story-card,
  .contact, .footer, .ecosystem {
    position: relative !important;
  }

  /* 3) Estes precisam continuar absolutos/fixos mesmo no mobile. */
  .navbtn, .logo-arrow, .story-tag,
  .hero .slide img {
    position: absolute !important;
  }
  .wa-float { position: fixed !important; }

  /* 4) Larguras fixas em pixel do desktop que "estouram" a tela — sem
     isso, mesmo com position:static o elemento continuaria largo demais. */
  .header-brand { width: 118px !important; height: auto !important; margin: 0 !important; }
  .header-social { display: flex !important; gap: 12px !important; width: auto !important; }
  .header-social a { width: 22px !important; height: 22px !important; }

  .case-slide { display: block !important; padding: 20px !important; min-height: 0 !important; }
  .case-copy { width: 100% !important; padding: 0 0 16px !important; }
  .case-copy p { width: 100% !important; height: auto !important; }
  .case-gallery { width: 100% !important; }
  .case-main { width: 100% !important; height: auto !important; aspect-ratio: 16/9 !important; object-fit: cover !important; }
  .case-thumbs { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; width: 100% !important; }
  .case-thumbs img { width: 100% !important; height: auto !important; }

  .testimonial-viewport { width: 100% !important; height: auto !important; }

  .story-panel { width: 100% !important; margin: 0 !important; padding: 24px 20px !important; }
  .story-viewport { width: 100% !important; height: auto !important; overflow-x: auto !important; }
  .story-grid { display: flex !important; overflow-x: auto !important; width: 100% !important; }
  .story-card { flex: 0 0 70% !important; height: 280px !important; }

  .eco-pills {
    width: 100% !important; height: auto !important;
    display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px !important;
  }

  .book > img { width: 100% !important; height: auto !important; }
  .book-copy { width: 100% !important; }
  .book-copy .label, .book-copy h2, .book-copy p, .book-copy .btn { width: auto !important; height: auto !important; }

  .lead-form > input,
  .lead-form textarea,
  .lead-form fieldset,
  .lead-form .invest-fieldset,
  .lead-form .segment-fieldset,
  .lead-form .project-field,
  .lead-form .form-submit,
  .lead-form .btn {
    width: 100% !important; height: auto !important; min-height: 0 !important;
  }
}

/* Em telas touch não existe hover, então as setas dos carrosséis (que
   ficam invisíveis até passar o mouse) precisam aparecer sempre — senão
   dá pra navegar por toque mas o usuário não vê onde tocar. */
@media (hover: none) {
  .hero .navbtn,
  .panorama .navbtn,
  .case-nav .navbtn,
  .logo-arrow {
    opacity: 1 !important;
  }
}

/* ==========================================================================
   Correção mobile v3 — seletores compostos "SEÇÃO .elemento" que têm
   especificidade CSS maior que o reset genérico (.site *) e por isso
   continuavam presos na posição/coordenada em pixel do desktop, mesmo
   depois dos resets anteriores.
   ========================================================================== */
@media (max-width: 820px) {

  /* Cabeçalho: logo e ícones lado a lado */
  .header { display: flex !important; align-items: center !important; justify-content: space-between !important; }
  .header-social { display: flex !important; gap: 12px !important; }
  .header-social .social-ig,
  .header-social .social-in,
  .header-social .social-wa {
    position: static !important; width: 22px !important; height: 22px !important;
  }

  /* Títulos e CTAs de seção que usavam left/top fixos */
  .why .section-title, .why .cta-row,
  .solutions .section-title, .solutions .cta-row,
  .cases .section-title, .cases .cta-row,
  .testimonials .section-title,
  .story-panel .section-title {
    position: static !important; width: 100% !important; height: auto !important; margin: 0 0 16px !important;
  }

  /* Verticais (moda/varejo, corporativo, foodservice, franquias) */
  .vertical .title,
  .v1 .c1, .v1 .c2, .v1 .img1, .v1 .img2,
  .v2 .c1, .v2 .c2, .v2 .img1, .v2 .img2, .v2 .cta-row {
    position: static !important; width: 100% !important; height: auto !important; margin: 0 0 20px !important;
  }
  .v1 .img1, .v1 .img2, .v2 .img1, .v2 .img2 { aspect-ratio: 16 / 9 !important; object-fit: cover !important; }

  /* Ecossistema Goakira */
  .ecosystem .badge, .ecosystem .eyebrow, .ecosystem .copy {
    position: static !important; width: 100% !important; height: auto !important; margin: 0 0 14px !important;
  }

  /* Livro */
  .book-copy .btn { position: static !important; width: 100% !important; }

  /* Formulário: alguns campos tinham seletor específico com prioridade maior */
  .lead-form .btn,
  .lead-form .project-field,
  .lead-form .form-submit,
  .lead-form .invest-fieldset,
  .lead-form .segment-fieldset {
    position: static !important; width: 100% !important; height: auto !important; min-height: 0 !important; margin: 0 0 14px !important;
  }

  /* Imagens da seção "Arquitetura não é custo" */
  .value-images .back, .value-images .front {
    position: static !important; width: 100% !important; height: auto !important; margin: 0 0 12px !important;
  }

  /* Depoimentos: card ocupa quase a tela toda, não a largura fixa do desktop */
  .testimonial-viewport { width: 100% !important; max-width: 100% !important; }
  .testimonial-card { flex: 0 0 88% !important; }

  /* Stories/reels: carrossel horizontal com imagens visíveis */
  .story-grid { display: flex !important; overflow-x: auto !important; gap: 12px !important; width: 100% !important; }
  .story-card { flex: 0 0 68% !important; height: 300px !important; }
  .story-card img { position: static !important; width: 100% !important; height: 100% !important; }
}

/* ==========================================================================
   Correção mobile v4 — panorama com largura de imagem travada em 1280px
   (aparecia cortado/vazio), triangulo decorativo do panorama fora de lugar,
   e overflow lateral em livro/cases.
   ========================================================================== */
@media (max-width: 820px) {
  .panorama { height: 300px !important; overflow: hidden !important; }
  .panorama .pan-slide img {
    width: 100% !important; height: 300px !important; object-fit: cover !important;
  }
  .panorama:after { display: none !important; }

  .book > img { max-width: 100% !important; }
  .case-main, .case-thumbs img { max-width: 100% !important; }
}

/* Correção mobile v5 — imagem do livro aparecendo cortada no topo */
@media (max-width: 820px) {
  .book { overflow: visible !important; height: auto !important; }
  .book > img { object-fit: contain !important; }
}

/* ==========================================================================
   Correção mobile v6 — última rodada: seta do carrossel de clientes com
   coordenada fixa (escapava para dentro de outras seções quando o
   carrossel de logos mudava de altura), panorama com alturas internas
   inconsistentes (434px vs a nova altura mobile), texto do formulário
   (consent-block) sobreposto ao botão de envio, e fundo da seção de
   stories/equipe travado em 1280px.
   ========================================================================== */
@media (max-width: 820px) {

  /* Seta do carrossel de clientes: usava top fixo em pixel (calculado para
     a altura de desktop). Troca para centralização por porcentagem, que se
     ajusta sozinha a qualquer altura do carrossel no mobile. */
  .logo-arrow {
    top: 50% !important;
    transform: translateY(-50%) !important;
  }

  /* Panorama: unifica a altura do carrossel, da trilha e do slide (estavam
     em valores diferentes — 300px por fora, 434px por dentro — o que
     descentralizava as setas e cortava a imagem). */
  .panorama, .panorama .track, .panorama .pan-slide {
    height: 300px !important;
  }
  .panorama .pan-slide > img {
    position: absolute !important; inset: 0 !important;
    width: 100% !important; height: 100% !important; object-fit: cover !important;
  }
  /* Recortes especiais de duas fotos do panorama (calculados em pixel para
     o desktop) — no mobile usam o mesmo tratamento genérico acima. */
  .panorama .pan-slide > img.figma-pan-prmn,
  .panorama .pan-slide > img.figma-pan-zoo {
    height: 100% !important; top: 0 !important; object-fit: cover !important;
  }

  /* Formulário: o texto de compromisso com privacidade ("Eu aceito...")
     tinha coordenada fixa e ficava em cima do botão de envio. */
  .consent-block {
    position: static !important; left: auto !important; top: auto !important;
    width: 100% !important; height: auto !important; margin: 0 0 16px !important;
  }

  /* Fundo de foto da seção de stories/equipe, travado em 1280px. */
  .team-bg {
    position: static !important; left: auto !important; top: auto !important;
    width: 100% !important; height: 220px !important;
  }
}

/* Texto do case (nome do cliente + depoimento) ficava com coordenada fixa
   e sobrepunha a foto — .case-copy p tem mais especificidade que o reset
   genérico e por isso escapou das correções anteriores. */
@media (max-width: 820px) {
  .case-copy p {
    position: static !important; left: auto !important; top: auto !important;
    width: 100% !important; height: auto !important; margin: 0 0 16px !important;
  }
}

/* Pedido: remover os carrosséis de imagens (panorama) da versão mobile,
   já que eram a origem dos vãos brancos e das setas fora do lugar. */
@media (max-width: 820px) {
  .panorama { display: none !important; }
}

/* Correção mobile v7 — miniaturas do carrossel de cases com coordenada fixa
   (left/top em pixel calculados para 1280px), sobrepondo a foto principal. */
@media (max-width: 820px) {
  .case-thumbs img {
    position: static !important;
    left: auto !important; top: auto !important;
    width: 100% !important; height: 140px !important;
  }
}

/* ==========================================================================
   Correção mobile v8 — ajustes de layout pedidos:
   1) case-slide com altura fixa (493px) cortava as miniaturas de baixo
   2) cards de "por que escolher"/"soluções" centralizados + respiro antes do CTA
   3) carrossel de reels mostrando 1 foto por vez (estilo slide)
   4) pills do ecossistema empilhadas (1 coluna)
   5) imagem do livro centralizada
   6) itens do rodapé com espaçamento visível entre si
   ========================================================================== */
@media (max-width: 820px) {

  /* 1) Case: altura livre em vez de fixa, para caber foto+texto+miniaturas */
  .case-slide { height: auto !important; }

  /* 2) Cards centralizados + respiro antes do botão */
  .info-card, .info-card h3, .info-card p,
  .solution-card, .solution-card h3, .solution-card p {
    text-align: center !important;
  }
  .why .cta-row, .solutions .cta-row {
    margin-top: 38px !important;
  }

  /* 3) Stories/reels: um cartão por vez, como slide */
  .story-grid {
    scroll-snap-type: x mandatory !important;
  }
  .story-card {
    flex: 0 0 100% !important;
    scroll-snap-align: center !important;
  }

  /* 4) Ecossistema: pills em coluna única */
  .eco-pills {
    grid-template-columns: 1fr !important;
  }

  /* 5) Livro: imagem centralizada */
  .book { text-align: center !important; }
  .book > img { display: block !important; margin: 0 auto !important; }

  /* 6) Rodapé: espaçamento visível entre os blocos */
  .footer {
    gap: 28px !important;
    padding: 36px 20px !important;
  }
  .footer-follow { margin: 0 0 4px !important; }
  .footer-social { margin: 0 0 4px !important; }
  .footer-gdesign { margin: 0 0 4px !important; }
  .footer-group { margin: 0 !important; }
}

/* Correção mobile v9 — segunda página do carrossel de logos (page-secondary)
   nunca recebeu a grade compacta que a primeira página (page-primary) já
   tinha, então ficava larga demais (grid de 8 colunas de 113px) e cortada. */
@media (max-width: 820px) {
  .logo-page {
    display: grid !important;
    grid-template-columns: repeat(4, 72px) !important;
    grid-template-rows: none !important;
    grid-auto-rows: 72px !important;
    justify-content: center !important;
    align-content: center !important;
    gap: 8px !important;
  }
  .logo-page img {
    width: 76px !important;
    height: 76px !important;
    transform: none !important;
  }
}

/* ==========================================================================
   Correção mobile v10 — mais peças internas nunca resetadas:
   1) .case-main (foto principal do case) ainda absoluta em left:530px
   2) .logo-track com largura fixa em pixel, quebrando o cálculo de "100%"
      de cada página do carrossel de logos
   3) .story-card com altura fixa incompatível com a nova largura (o "zoom")
   4) .eco-logos (logos de parceiros) e .ecosystem .badge (ícone) nunca
      resetados — ficavam fora da tela
   5) reforço de espaçamento/alinhamento do rodapé
   ========================================================================== */
@media (max-width: 820px) {

  /* 1) Case: a foto principal também estava com coordenada fixa */
  .case-main {
    position: static !important; left: auto !important; top: auto !important;
  }

  /* 2) Carrossel de logos: a trilha não pode ter largura fixa, senão
     "100%" de cada página vira 100% de um valor errado */
  .logo-track { width: auto !important; }

  /* 3) Stories: mantém a proporção da foto (evita o efeito de "zoom"/corte
     que a altura fixa causava numa largura maior) */
  .story-card {
    flex: 0 0 100% !important;
    height: auto !important;
    aspect-ratio: 215 / 320 !important;
  }
  .story-card > img, .story-crop-source {
    width: 100% !important; height: 100% !important;
  }

  /* 4) Ecossistema: ícone e logos de parceiros, nunca resetados */
  .ecosystem .badge {
    position: static !important; left: auto !important; top: auto !important;
    width: 90px !important; height: auto !important; margin: 0 auto 16px !important; display: block !important;
  }
  .eco-logos {
    position: static !important; left: auto !important; top: auto !important;
    width: 100% !important; height: auto !important;
    flex-wrap: wrap !important; justify-content: center !important; gap: 24px !important;
    margin-top: 20px !important;
  }
  .eco-logos img { max-width: 110px !important; height: auto !important; }

  /* 5) Rodapé: reforço de alinhamento e espaçamento */
  .footer-social {
    display: flex !important; justify-content: center !important; gap: 16px !important;
  }
  .footer-group {
    display: flex !important; flex-direction: column !important;
    align-items: center !important; gap: 8px !important;
  }
}

/* ==========================================================================
   V12 — Correções pedidas (QA cruzando mobile x desktop)
   ========================================================================== */

/* 1) Carrossel de logos: page-secondary nunca recebeu a mesma grade
   compacta do mobile que page-primary já tinha, então seu grid ficava
   com 5 colunas de 113px (medida de desktop) dentro de uma página de
   largura de tela — o conteúdo estourava, o justify-content:center
   centralizava esse excesso e ele vazava por cima da página anterior,
   dando a impressão de logos sobrepostos. */
@media (max-width: 820px) {
  .logo-page.page-primary,
  .logo-page.page-secondary {
    grid-template-columns: repeat(4, 72px) !important;
    grid-template-rows: none !important;
    grid-auto-rows: 72px !important;
  }
  /* page-primary tem 16 logos = 4 linhas de 72px; a altura fixa antiga
     (220px) só cabia ~3 linhas e cortava a primeira/última fileira. */
  .logo-section,
  .logo-viewport,
  .logo-track,
  .logo-page {
    height: 320px !important;
  }
}

/* 3) Reels ("Arquitetura, experiência e vendas") no mobile: .story-grid/
   .story-viewport ainda carregavam uma altura fixa de 205px de um patch
   antigo. Isso "espremia" o card (que deveria seguir aspect-ratio 215/320)
   numa caixa baixa e larga, forçando o object-fit:cover a cortar/ampliar
   a foto — por isso o rosto aparecia em close e o texto do reel cortado.
   Com altura livre, o card volta à proporção de retrato e mostra a foto
   inteira, sem zoom. */
@media (max-width: 820px) {
  .story-viewport { height: auto !important; }
  .story-grid { height: auto !important; align-items: flex-start !important; }
  .story-card { height: auto !important; aspect-ratio: 215 / 320 !important; }
  .story-card > img, .story-crop-source {
    width: 100% !important; height: 100% !important; object-fit: cover !important;
  }
}

/* 4) Formulário "Seu maior resultado...": título e texto de introdução
   centralizados. */
@media (max-width: 820px) {
  .contact > div:first-child { text-align: center !important; }
  .contact h2, .contact > div:first-child p { text-align: center !important; }
}

/* 5) Rodapé: ".footer-group p" e ".footer-group img" ainda tinham
   position:absolute + coordenadas fixas de desktop (left/top em pixel)
   de uma regra antiga sem media query. Como essa regra tem mais
   especificidade que o reset genérico ".site *", ela vencia mesmo no
   mobile — os dois elementos saíam do fluxo, o "Ecossistema Goakira"
   pulava pro topo do rodapé e sobrepunha "ACOMPANHE NOSSOS PROJETOS...".
   Com position estática, o rodapé recupera o empilhamento vertical
   correto (título > ícones > logo > grupo), cada bloco no seu lugar,
   sem sobreposição. */
@media (max-width: 820px) {
  .footer-group p,
  .footer-group img {
    position: static !important;
    left: auto !important;
    top: auto !important;
    margin: 0 !important;
  }
  .footer-group img { width: auto !important; height: 29px !important; }
  .footer-group p { width: auto !important; height: auto !important; text-align: center !important; }
  .footer-group {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 8px !important;
    text-align: center !important;
    width: 100% !important;
    height: auto !important;
  }
}

/* ==========================================================================
   V13 — Ajustes finos pedidos numa segunda rodada de QA (mobile)
   ========================================================================== */

/* 1) "Soluções completas": os cards tinham width:261px fixo (medida de
   desktop) dentro de uma coluna de ~358px — ficavam encostados na
   esquerda em vez de centralizados. Agora ocupam a largura da coluna
   até um teto de 340px, centralizados. */
@media (max-width: 820px) {
  .solution-card {
    width: 100% !important;
    max-width: 340px !important;
    margin: 0 auto !important;
  }
}

/* 2) Depoimentos: o card ficava encostado na borda esquerda do viewport
   (flex-basis 88%), sobrando um respiro só do lado direito — por isso
   parecia descentralizado. Com padding simétrico no viewport, o card
   fica com a mesma folga dos dois lados. */
@media (max-width: 820px) {
  .testimonial-viewport {
    padding: 0 23px !important;
    box-sizing: border-box !important;
  }
}

/* 3) Reels: o card ocupava a largura cheia do painel (350px). Reduzido
   com padding simétrico no viewport — o card (que já segue
   aspect-ratio 215/320) encolhe e fica centralizado, mostrando a foto
   inteira, só que menor. */
@media (max-width: 820px) {
  .story-viewport {
    padding: 0 40px !important;
    box-sizing: border-box !important;
  }
}

/* 4) Ecossistema: logos de Goakira/Potencializee/GDesign em coluna,
   uma embaixo da outra, em vez de lado a lado. */
@media (max-width: 820px) {
  .eco-logos {
    flex-direction: column !important;
    align-items: center !important;
  }
}

/* 5) Formulário "Seu maior resultado...": espaçamento de ~1cm (38px)
   entre o título e o texto de corpo. */
@media (max-width: 820px) {
  .contact h2 { margin: 0 0 38px !important; }
}

/* 6) Rodapé: ".social-ig img" ainda tinha position:absolute com
   coordenadas fixas de desktop (regra antiga sem media query). No
   desktop isso não quebra porque ".footer-social a" vira
   position:relative e "contém" a imagem — mas no mobile o link
   continua static, então a imagem escapava para o ancestral
   posicionado mais próximo (.footer) e "pulava" para o topo do
   rodapé, longe dos ícones de LinkedIn/WhatsApp (que já estavam
   corretos). Position estática resolve — os três ícones ficam lado a
   lado, no mesmo lugar. */
@media (max-width: 820px) {
  .footer-social .social-ig img {
    position: static !important;
    left: auto !important;
    top: auto !important;
  }
}

/* ==========================================================================
   V14 — Reels: carrossel mostrando só 1 card (resto em branco) + tag
   "SAIBA MAIS" abaixo da imagem. Formulário de contato justificado.
   ========================================================================== */

/* 1) Carrossel de reels quebrado: uma regra antiga de mobile deixava
   ".story-grid" com width:100% e overflow:auto — ao mesmo tempo que o
   JS aplica um transform de carrossel no mesmo elemento. Com o grid
   travado em 100% (a largura de UM card só) e overflow próprio, os
   outros 9 cards ficavam fora da área "auto" do próprio grid, sem
   aparecer. A correção: o grid volta a ter largura de conteúdo (soma
   de todos os cards) e só a ".story-viewport" (o "olho mágico" de
   fora) recorta o que aparece — como o carrossel de cases e o de
   depoimentos, que nunca tiveram esse problema. */
@media (max-width: 820px) {
  .story-viewport {
    overflow-x: hidden !important;
    overflow-y: hidden !important;
  }
  .story-grid {
    overflow: visible !important;
  }
  .story-card {
    flex-shrink: 0 !important;
  }
}

/* 2) Tag "SAIBA MAIS": estava sobreposta em cima da foto (posição
   absoluta, encostada na borda de baixo). Agora fica abaixo da
   imagem, fora dela, com ~1cm (38px) de distância — a imagem mantém
   a proporção de retrato 215/320 e a tag flui normalmente abaixo
   dela, centralizada por margin:auto (sem usar flex-direction:column
   no card, que reinterpretaria as larguras antigas de ".story-card"
   como alturas e quebraria o carrossel). */
@media (max-width: 820px) {
  .story-card {
    display: block !important;
    height: auto !important;
    aspect-ratio: auto !important;
  }
  .story-card > img,
  .story-crop-source {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 215 / 320 !important;
  }
  .story-tag {
    display: flex !important;
    position: static !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;
    margin: 38px auto 0 !important;
  }
  .story-card:hover .story-tag,
  .story-card:focus-visible .story-tag {
    transform: none !important;
  }
}

/* 3) Formulário "Seu maior resultado...": título e corpo de texto
   centralizados, no mesmo estilo do texto de destaque do Ecossistema
   ("A GDesign faz parte do Ecossistema Goakira...") — primeiro
   parágrafo em negrito, com largura confortável (não esticado de
   ponta a ponta da tela), mantendo o espaçamento de ~1cm entre título
   e corpo. */
@media (max-width: 820px) {
  .contact > div:first-child {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }
  .contact > div:first-child p {
    text-align: center !important;
    max-width: 300px !important;
  }
  .contact > div:first-child p:first-of-type {
    font-weight: 600 !important;
    font-size: 16px !important;
  }
}


/* Correção: setas "próximo" do hero e dos dois carrosséis panorama
   (antes de "Arquitetura que vende", "Por que as empresas escolhem a
   GDesign?" e "Soluções completas...") estavam com a ponta virada para
   a esquerda, igual à seta "anterior". Força a rotação correta por
   cima de qualquer regra anterior. */
.hero .navbtn.next img,
.panorama .navbtn.next img {
  transform: rotate(180deg) !important;
}

/* ==========================================================================
   Correção definitiva mobile — carrossel de cases ("Conheça alguns
   projetos que ajudaram marcas a crescer."). O sistema antigo de
   coordenadas absolutas (copiado pixel a pixel do Figma em 1280px) tinha
   dezenas de patches conflitantes tentando resetar cada peça pra mobile.
   Em vez de caçar mais um conflito, este bloco reaplica por cima de tudo
   o mesmo layout simples (grid em fluxo normal) já validado e aprovado
   na LP Corporativo, tanto no container do carrossel quanto dentro de
   cada slide. Desktop não é tocado. */
@media (max-width: 820px) {
  .cases { padding: 36px 0 44px !important; }
  .case-viewport {
    position: static !important;
    width: 100% !important; max-width: 100% !important;
    left: auto !important; top: auto !important; height: auto !important;
  }
  .case-track { width: auto !important; max-width: none !important; height: auto !important; }
  .case-slide {
    position: static !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    flex: 0 0 100% !important;
    width: 100% !important; min-width: 100% !important;
    height: auto !important; min-height: 0 !important;
    padding: 0 20px !important; gap: 16px !important;
  }
  .case-copy {
    position: static !important;
    width: 100% !important; max-width: 100% !important;
    left: auto !important; top: auto !important; padding: 0 0 16px !important;
  }
  .case-copy p {
    position: static !important;
    width: 100% !important; max-width: 100% !important;
    left: auto !important; top: auto !important; height: auto !important;
    line-height: 1.7 !important;
  }
  .case-gallery { position: static !important; width: 100% !important; padding: 0 !important; }
  .case-main {
    position: static !important;
    left: auto !important; top: auto !important;
    width: 100% !important; max-width: 100% !important;
    height: auto !important; aspect-ratio: 16/10 !important;
    object-fit: cover !important;
  }
  .case-thumbs {
    display: grid !important;
    grid-template-columns: repeat(4,1fr) !important;
    width: 100% !important; margin-top: 10px !important;
  }
  .case-thumbs img {
    position: static !important;
    left: auto !important; top: auto !important;
    width: 100% !important; max-width: 100% !important;
    height: auto !important; aspect-ratio: 1/1 !important;
    object-fit: cover !important;
  }
  .case-nav .navbtn { top: 40% !important; }
  .case-nav .prev { left: 5px !important; }
  .case-nav .next { right: 5px !important; }
  .cases .cta-row {
    position: static !important;
    width: 100% !important; left: auto !important; top: auto !important;
    margin: 20px 0 0 !important;
  }
}

/* ==================================================
   Formulário RD Station: contenção de largura no mobile
   O RD Station renderiza seus próprios campos com largura
   fixa própria (maior que a tela), o que pode empurrar o
   card inteiro para fora do centro, cortado na lateral.
   Força todo o conteúdo injetado a respeitar 100% da
   largura do painel.
   ================================================== */
@media (max-width: 820px) {
  .lead-form{overflow-x:hidden!important;box-sizing:border-box!important}
  #form-gdesign-lp-principal-f67437ce0c2bd2e883d4{width:100%!important;max-width:100%!important}
  #form-gdesign-lp-principal-f67437ce0c2bd2e883d4 *{
    max-width:100%!important;
    box-sizing:border-box!important;
  }
  #form-gdesign-lp-principal-f67437ce0c2bd2e883d4 input,
  #form-gdesign-lp-principal-f67437ce0c2bd2e883d4 select,
  #form-gdesign-lp-principal-f67437ce0c2bd2e883d4 textarea,
  #form-gdesign-lp-principal-f67437ce0c2bd2e883d4 button{
    width:100%!important;
  }
}
