.elementor-field-group {
margin-top: 2rem;
padding-bottom: 2rem;
border-bottom: 1px solid #eee;
}
.elementor-field-group:last-child {
border-bottom: none;
}
.elementor-field-label {
font-weight: bold;
}
.dynamic-remote-content-element h4:not(:first-child) {
margin-top: 2rem;
}
.dynamic-remote-content-element p,
.dynamic-remote-content-element ol li {
max-width: 66%;
}
.dynamic-remote-content-element ol {
margin: 0 0 0 1.6666rem;
}
@property --p{
syntax: '<number>';
inherits: true;
initial-value: 0;
}
.pie {
--p:20;
--b:22px;
--c:#95b4c7;
--w:150px;
width:var(--w);
aspect-ratio:1;
position:relative;
display:inline-grid;
margin:5px;
place-content:center;
font-size:25px;
font-weight:bold;
font-family:sans-serif;
margin-left: 2rem;
}
.pie:before,
.pie:after {
content:"";
position:absolute;
border-radius:50%;
}
.pie:before {
inset:0;
background:
radial-gradient(farthest-side,var(--c) 98%,#0000) top/var(--b) var(--b) no-repeat,
conic-gradient(var(--c) calc(var(--p)*1%),#0000 0);
-webkit-mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
}
.pie:after {
inset:calc(50% - var(--b)/2);
background:var(--c);
transform:rotate(calc(var(--p)*3.6deg)) translateY(calc(50% - var(--w)/2));
}
.animate {
animation:p 1s .5s both;
}
.no-round:before {
background-size:0 0,auto;
}
.no-round:after {
content:none;
}
@keyframes p {
from{--p:0}
}