/* Start custom CSS for html, class: .elementor-element-1cccf0a *//* =========================================================
BLUE SEGMENTS — REFINADOS
MAIS PRÓXIMOS DO CENTRO / MENOS DISPERSOS
========================================================= */
/* =========================================================
ORBIT 02
PEQUENO ACENTO SUPERIOR ESQUERDO
========================================================= */
.ih1-accent-02 {
width:
650px;
height:
650px;
transform:
translate(-50%,-50%);
background:
conic-gradient(
from 0deg,
transparent 0deg 242deg,
rgba(23,105,255,.72)
242deg 253deg,
transparent
253deg 360deg
);
-webkit-mask:
radial-gradient(
farthest-side,
transparent
calc(100% - 1.55px),
#000
calc(100% - 1.55px)
);
mask:
radial-gradient(
farthest-side,
transparent
calc(100% - 1.55px),
#000
calc(100% - 1.55px)
);
}
/* =========================================================
ORBIT 03 — ESQUERDA
========================================================= */
.ih1-accent-03-a {
width:
900px;
height:
900px;
transform:
translate(-50%,-50%);
background:
conic-gradient(
from 0deg,
transparent
0deg 206deg,
rgba(23,105,255,.66)
206deg 218deg,
transparent
218deg 360deg
);
-webkit-mask:
radial-gradient(
farthest-side,
transparent
calc(100% - 1.55px),
#000
calc(100% - 1.55px)
);
mask:
radial-gradient(
farthest-side,
transparent
calc(100% - 1.55px),
#000
calc(100% - 1.55px)
);
}
/* =========================================================
ORBIT 03 — DIREITA
========================================================= */
.ih1-accent-03-b {
width:
900px;
height:
900px;
transform:
translate(-50%,-50%);
background:
conic-gradient(
from 0deg,
transparent
0deg 332deg,
rgba(23,105,255,.64)
332deg 343deg,
transparent
343deg 360deg
);
-webkit-mask:
radial-gradient(
farthest-side,
transparent
calc(100% - 1.55px),
#000
calc(100% - 1.55px)
);
mask:
radial-gradient(
farthest-side,
transparent
calc(100% - 1.55px),
#000
calc(100% - 1.55px)
);
}
/* =========================================================
REMOVER ACENTOS DA ORBITA EXTERNA
ERAM OS QUE ESTAVAM INDO PARA OS CANTOS
========================================================= */
.ih1-accent-04-a,
.ih1-accent-04-b {
display:
none;
}
/* =========================================================
INSYGHT — ORBIT ACCENTS FINAL
MESMA ÓRBITA DOS ÍCONES, MAS SEM PASSAR POR ELES
========================================================= */
/* =========================================================
BASE
========================================================= */
.insyght-h1 .ih1-accent {
position: absolute;
z-index: 2;
top: 50%;
left: 50%;
border-radius: 50%;
pointer-events: none;
}
/* =========================================================
WHATSAPP
ÍCONE ESTÁ EM ~300° NO SISTEMA CONIC
AZUL FICA ANTES DELE, SEM ENCOSTAR
========================================================= */
.insyght-h1 .ih1-accent-wa {
width: 720px;
height: 720px;
transform:
translate(-50%, -50%);
background:
conic-gradient(
from 0deg,
transparent 0deg 278deg,
rgba(23,105,255,.66)
278deg 288deg,
transparent
288deg 360deg
);
-webkit-mask:
radial-gradient(
farthest-side,
transparent
calc(100% - 1.45px),
#000
calc(100% - 1.45px)
);
mask:
radial-gradient(
farthest-side,
transparent
calc(100% - 1.45px),
#000
calc(100% - 1.45px)
);
}
/* =========================================================
ANALYTICS
SEGMENTO CURTO PRÓXIMO, MAS NÃO ATRÁS
========================================================= */
.insyght-h1 .ih1-accent-analytics {
width: 720px;
height: 720px;
transform:
translate(-50%, -50%);
background:
conic-gradient(
from 0deg,
transparent 0deg 38deg,
rgba(23,105,255,.62)
38deg 48deg,
transparent
48deg 360deg
);
-webkit-mask:
radial-gradient(
farthest-side,
transparent
calc(100% - 1.45px),
#000
calc(100% - 1.45px)
);
mask:
radial-gradient(
farthest-side,
transparent
calc(100% - 1.45px),
#000
calc(100% - 1.45px)
);
}
/* =========================================================
META
SEGMENTO À ESQUERDA/ACIMA DO ÍCONE
========================================================= */
.insyght-h1 .ih1-accent-meta {
width: 900px;
height: 900px;
transform:
translate(-50%, -50%);
background:
conic-gradient(
from 0deg,
transparent 0deg 248deg,
rgba(23,105,255,.50)
248deg 258deg,
transparent
258deg 360deg
);
-webkit-mask:
radial-gradient(
farthest-side,
transparent
calc(100% - 1.4px),
#000
calc(100% - 1.4px)
);
mask:
radial-gradient(
farthest-side,
transparent
calc(100% - 1.4px),
#000
calc(100% - 1.4px)
);
}
/* =========================================================
GOOGLE ADS
SEGMENTO DEPOIS DO ÍCONE
========================================================= */
.insyght-h1 .ih1-accent-ads {
width: 900px;
height: 900px;
transform:
translate(-50%, -50%);
background:
conic-gradient(
from 0deg,
transparent 0deg 238deg,
rgba(23,105,255,.53)
238deg 248deg,
transparent
248deg 360deg
);
-webkit-mask:
radial-gradient(
farthest-side,
transparent
calc(100% - 1.4px),
#000
calc(100% - 1.4px)
);
mask:
radial-gradient(
farthest-side,
transparent
calc(100% - 1.4px),
#000
calc(100% - 1.4px)
);
}
/* =========================================================
TAG MANAGER
LADO DIREITO, DESLOCADO DO ÍCONE
========================================================= */
.insyght-h1 .ih1-accent-gtm {
width: 900px;
height: 900px;
transform:
translate(-50%, -50%);
background:
conic-gradient(
from 0deg,
transparent 0deg 104deg,
rgba(23,105,255,.50)
104deg 114deg,
transparent
114deg 360deg
);
-webkit-mask:
radial-gradient(
farthest-side,
transparent
calc(100% - 1.4px),
#000
calc(100% - 1.4px)
);
mask:
radial-gradient(
farthest-side,
transparent
calc(100% - 1.4px),
#000
calc(100% - 1.4px)
);
}
/* =========================================================
REFINAMENTO:
DEIXA O AZUL MAIS DELICADO
========================================================= */
.insyght-h1 .ih1-accent {
opacity: .88;
}
/* =========================================================
ORBITAS CINZAS
========================================================= */
.insyght-h1 .ih1-ring {
border-width: 1px;
border-style: solid;
border-color:
rgba(16,16,18,.050);
}
.insyght-h1 .ih1-ring-01 {
border-color:
rgba(16,16,18,.057);
}
.insyght-h1 .ih1-ring-02 {
border-color:
rgba(16,16,18,.054);
}
.insyght-h1 .ih1-ring-03 {
border-color:
rgba(16,16,18,.050);
}
.insyght-h1 .ih1-ring-04 {
border-color:
rgba(16,16,18,.043);
}
/* =========================================================
ÍCONES
NÃO PRECISAM MAIS DE MÁSCARA TÃO GRANDE
========================================================= */
.insyght-h1 .ih1-node-shell::before {
inset: -2px;
background: #FFFFFF;
}
/* =========================================================
NODE REFINEMENT
========================================================= */
.insyght-h1 .ih1-node-shell {
border:
1px solid rgba(16,16,18,.055);
background:
rgba(255,255,255,.99);
box-shadow:
0 13px 32px rgba(16,16,18,.060),
0 2px 6px rgba(16,16,18,.020);
}
/* =========================================================
MICRO HOVER
========================================================= */
@media (hover:hover) {
.insyght-h1 .ih1-node-shell {
transition:
transform .28s ease,
box-shadow .28s ease,
border-color .28s ease;
}
.insyght-h1 .ih1-node:hover
.ih1-node-shell {
transform:
translateY(-2px);
border-color:
rgba(23,105,255,.13);
box-shadow:
0 17px 38px rgba(16,16,18,.075),
0 0 0 3px rgba(23,105,255,.025);
}
}
/* =========================================================
MOBILE
========================================================= */
@media (max-width:790px) {
.insyght-h1 .ih1-accent {
display: none !important;
}
}
/* =========================================================
AJUSTE INSYGHT
SOMENTE AS LINHAS ORBITAIS: AZUL → PRETO
========================================================= */
.ih1-accent-wa {
background:
conic-gradient(
from 0deg,
transparent 0deg 278deg,
rgba(16,16,18,.62) 278deg 288deg,
transparent 288deg 360deg
) !important;
}
.ih1-accent-analytics {
background:
conic-gradient(
from 0deg,
transparent 0deg 38deg,
rgba(16,16,18,.58) 38deg 48deg,
transparent 48deg 360deg
) !important;
}
.ih1-accent-meta {
background:
conic-gradient(
from 0deg,
transparent 0deg 248deg,
rgba(16,16,18,.50) 248deg 258deg,
transparent 258deg 360deg
) !important;
}
.ih1-accent-ads {
background:
conic-gradient(
from 0deg,
transparent 0deg 238deg,
rgba(16,16,18,.53) 238deg 248deg,
transparent 248deg 360deg
) !important;
}
.ih1-accent-gtm {
background:
conic-gradient(
from 0deg,
transparent 0deg 104deg,
rgba(16,16,18,.50) 104deg 114deg,
transparent 114deg 360deg
) !important;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-454dcea *//* =========================================================
HEADLINE — COMPOSIÇÃO EM 3 LINHAS
========================================================= */
.ips-header {
width:
min(900px,100%);
margin:
0 auto 66px;
text-align:
center;
}
.ips-main-headline {
width:
100%;
max-width:
900px;
margin:
0 auto;
color:
#101012;
font-family:
"Manrope",
-apple-system,
BlinkMacSystemFont,
"Segoe UI",
sans-serif;
font-size:
clamp(46px,4.45vw,62px);
line-height:
.99;
font-weight:
700;
letter-spacing:
-.058em;
}
.ips-headline-row {
display:
block;
white-space:
nowrap;
}
.ips-headline-row + .ips-headline-row {
margin-top:
3px;
}
.ips-headline-row em {
color:
#99999E;
font-style:
normal;
font-weight:
700;
}
/* =========================================================
TABLET
========================================================= */
@media (max-width: 980px) {
.ips-header {
max-width:
780px;
}
.ips-main-headline {
max-width:
780px;
font-size:
clamp(42px,5vw,54px);
}
}
/* =========================================================
MOBILE
========================================================= */
@media (max-width: 680px) {
.ips-header {
max-width:
390px;
margin-bottom:
44px;
}
.ips-main-headline {
max-width:
365px;
font-size:
clamp(34px,8.8vw,40px);
line-height:
1.01;
letter-spacing:
-.052em;
}
.ips-headline-row {
white-space:
normal;
}
.ips-headline-row + .ips-headline-row {
margin-top:
4px;
}
}
/* =========================================================
SMALL MOBILE
========================================================= */
@media (max-width: 390px) {
.ips-main-headline {
max-width:
340px;
font-size:
32px;
}
}/* End custom CSS */